Configuring JavaScripts

Configuring Existing JavaScript

The Quik! Form Viewer uses iScroll and jQuery for various features. By default these scripts are set to be accessed from the Quik! server (e.g. https://www.quikforms.com/shared/scripts/QFE/jquery-1.9.1.min.js) but can be changed to your environment. Set each scripts property to a location of your choosing with the iScrollFilePath and jQueryFilePath properties with either a fixed or relative URL to the JavaScript files included with this software in the JavaScripts folder.

Adding Custom JavaScript

The Quik! Forms Viewer can be modified with custom JavaScript to enable features that aren't standard within the form. For example, if you want the form viewer to automatically scroll to a page within the form package based on the user checking a specific checkbox, you could write JavaScript (perhaps leveraging JQuery) to perform an action after the checkbox is clicked. 

A unique feature of the Quik! Form Engine is the ability to add custom JavaScript to the forms and extend your own customized functionality. For example, if you want to validate a field or cause events to fire when certain form fields are interacted with you could include a JavaScript file and set a JavaScript action to run. Set the CustomJavaFileIncludePath and CustomJavaScript properties.

Understanding Form Elements

To aid in your custom JavaScript, there are several aspects of the Quik! Form Viewer that you can leverage.

Forms

Each form in the package can be identified by an instance number in a hidden input field that appears before the first page of each form. The naming convention of the form identifier is as follows:
<input type="hidden" id="FormID<COUNT #>" name="FormID-Instance.<COUNT #>" value="<FormID>-<Form Instance #>" />
For example:

• The form instance tag for FormID = 2 may appear as follows:

<input type="hidden" id="FormID1" name="FormID-Instance.1" value="2" />

• The form instance tag for FormID = 449 may appear as follows:

<input type="hidden" id="FormID2" name="FormID-Instance.2" value="449" />

• The form instance tag for FormID = 2, copy number 1, may appear as follows:

<input type="hidden" id="FormID3" name="FormID-Instance.3" value="2-1" />
The number in the field name (e.g. the "1" in "FormID-Instance.1") is the counter of the FormID fields being added to the document and the "value" attribute is the actual FormID number (e.g. the value of "FormID-Instance.1" is "2"). If the FormID is a duplicate form then the value will have the FormID with a hyphen and the form instance number (e.g. "FormID-Instance.3" value = "2-1").

Pages

Each page is named with the FormID, Form Instance, Page Number and Page Instance. If you need to access a specific page you can determine a reference ID for a given form as follows:

• FormID – The FormID is the unique identifier assigned by Quik! for the form (e.g. "FID12" for form ID 12)
• Form Instance - if there are multiple copies of the same form the instance will be the instance number with a hyphen (e.g. "FID12-1)
• Page Number – the number of the page in the form (e.g. "FID12p2" is page 2 in Form ID 12)
• Page Instance – if there are multiple copies of the same form the instance will be the instance number of the form with a hyphen (e.g. "FID12-1p2-1" is page 2 in the first copy of Form ID 12)

A page is identified within the Quik! Form Viewer as "FID" with the form ID number and "p" with the page number:
FID12p2 = FormID 12, page 2

Fields

Each field is named according to the Quik! Field Definition. To call a field by name within javascript use the field name. If there are multiple copies of the same form then the form's instance number is added to the field name (e.g. "1own.FName", "1own.FName-1").