Javascript to stack form fields in list order based on checkbox selection

[ItsMissMeliss]

Disclaimer: Extremely green to javascript. 
I'm attempting to create a pdf form (no HTML) That hides/displays certain form fields based on a checkbox.
I've used the 'if (event.' target values to control the hidden/visible function, but I need a method to print the selected form fields in a compiled/organized list view (simply selecting 'print' >'form fields only' won't cut it, as that leads to multiple page breaks and blanks).
(further explanation)
The form is a 'user setup' guide listing multiple systems and applications for a new user that my team will setup access. Based on that new user's role, we'll make selections by checkbox of which programs credentials will need assigned. This is a multi-page document as there are a plethora of systems and apps that may or may not be assigned, listed in alphabetical order. 
Say I select two checkboxes that fields are located on Pg 1, and one checkbox that fields are located on Pg 5, and another on Pg 6, etc etc...what I end up with goes something like:
PG 1 - two visible form field sections
PG 2 - blank page

PG 3 - blank page

PG 4 - blank page

PG 5 - one visible section

PG 6 - two visible sections

Is their not a way to compile selected field sections and have them populate one after the other when printing, no matter the order of being selected? 

[Thom Parker]

Creating fields dynamically is possible, but not a good method.  A better method is to create a summary that lists the desired info in the desired order and format.  There a couple of different ways to do this depending on how the form is being used. For example, is this form used only interally by a small set of users who have Acrobat Professional and you have some control over these systems?  Or is the form used by anyone who can download it off of a public web site?

 One technique would be to use a Page tempate that has field sets setup for reciveing the summary data. The summary script copies selected data from the form intot these field sets. This works if the form sections have similar formats and info, so you can make a set of summary fields that will work for any data group.  

A more generic solution is to put a single page size form field on the page template. Then fill it with multiline formatted text generated from the selected form sections.   This approach takes a little more scripting skills becaues it requires the use of rich text spans. 

[ItsMissMeliss]

Hi, Thom - thanks for your reply!
To answer your question - the form is filled out by a small team of 7 people (my team). We select the apps that the user will need based on role, and then as those fields appear, we input what their credentials and login instruction(s) will be for each app. After that, we flatten the document and send it to the user via email, no html or website download involved. We house the pdf on a google drive and access to edit is only given to my teammates (yes, we use Adobe Acrobat Pro).
There are 42 different applications that we administrate, and so the list is quite extensive. Right now I have a grid of checkboxes laid out with the name of each system/app. If an app name box is checkmarked, the value will appear on the page it currently resides rather than in a stacking order. I've not ever utilized summary scripts, but I'm happy to start researching it now. I've dropped a very short sampling of the document I'm creating with a few field sets to show how the current method displays. 

[Thom Parker]

Since the form is used with Acrobat Pro in a controlled environment, I'd suggest creating an automation tool for this purpose. 

Start by looking at the "Report" object in the Acrobat JavaScript Reference.

https://opensource.adobe.com/dc-acrobat-sdk-docs/library/jsapiref/JS_API_AcroJS.html#report

This object is a good way to build the backbone of a list oriented report. It automatically creates as many pages as are necessary for the listed items.   The "report.writeText" function has a wonderful undocumented return value, which is the (default) page coordinates of the text it writes out. This provide a method for tracking the location of the specific summary sections. 

To make a really nice looking summary it will also be necessary to add form fields for better formatted text (in places such as the title and intro block at the top) and for any images, which it looks like you have an icon for each app, hence the importance of tracking the summary section for each app. 

[ItsMissMeliss]

Thanks, Thom - I think this may be getting somewhere. Still hitting roadblocks regarding the icon/images for each app. All of the report object context I've been reading states it's a text-only solution (albeit with rich formatting). Is their a separate formula to use in report and/or summary functions that would still include the image of each icon beside the descriptions and user fields as previously built?

[ItsMissMeliss]

Additionally I found this link with example syntax...by your opinion, would this be a good outline to follow regarding the needs for my form example? Since I'm so new at this, I'm still learning some of the action and object parameters. Example formulas definitely help me get a better idea of formulating the right output. Thanks again.

https://acrobatusers.com/tutorials/building-pdf-reports-with-javascript/

[Thom Parker]

That's an old article, but still valid. It shows the basics of the process, but to build a really nice report you have to add items, such as images and graphics after the report object is opened. Images are added with the button field and other graphics with the drawing markups. If you want different fonts, or special formatting, then text can also be switched out by overlaying text fields or text annotations over the target text. To do this effectively the script will need to collect the relevant location information by saving the return values from specific report.writeText calls.  

[ItsMissMeliss]

I think I'm in need of more guidance around the syntax for using the report object but including summary also. I first attempted using a template with one of the app list pages as an example (page 3 of the sample doc I sent), but it would simply copy the same selections made by checkbox with giant blank spaces between. If I go the report route (or what I've tried so far), it lists out the form fields completely out of order...not to mention I cannot figure out how to include the app logo image--should I revert to using a stamp in its place? 

I am confusion. lol. 

[Thom Parker]

There are a lot of details to placing text and images on a page correctly.  First, the ordering of things is up to you. Rather than copying directly, collect the report data into data structure that best fits the way you want the data organized in the report. If there are lists of things, they can be sorted. Then the report (regardless of the specific methodology used) can be populated in the prefered order.   

The logo image files can be loaded into a button field.  The trick is to know the correct location for each logo used. If I were writing the code, using a report object to build the report, then I'd use the organizing data structure to also store the page number and coordinates of application entry on the report. Then use those coordintates to add a button field to the report for the logo. 

But a page template can also be used to build a report. I like the page template idea best, as long as the same presentation can be used for each application.  In this case  a button field for the logo is needed on the template for each application entry section.