The LFForm Object

The LFForm object provides a global interface for accessing Laserfiche form elements and events using JavaScript. Through simple functions, you can find a specific field, retrieve the field values, and update field contents. You also have access to events both at the individual field level as well as the form submission event.

Identification Objects

Identification objects are objects containing information identifying which fields the interface should act on. Identification objects can have the following properties:

Note: In all LFForm interfaces, you can specify an array of identification objects instead of just one object to target multiple fields.

Example: LFForm.getFieldValues([{fieldId: 2}, {fieldId: 3}]).

Table/Collection Row/Set Templates

For tables and collections, a form stores the definition for each row or set as a template. These templates are used to generate the row or set whenever they are added. Some of the interfaces in the LFForm object have the ability to affect the template of the field, with the ability to apply changes to future rows or sets.

For these interfaces, when your ID object specifies an index (for example {fieldId: 3, index: 1}), the change will only be applied to the field at the specified index. If your ID object does not specify an index (for example {fieldId: 3}), the change will be applied to the template, and will be applied to all existing and future rows or sets.

The LFForm Properties

The LFForm object contains the following properties that describe the current process information at runtime. They can be used to conditionally perform actions in JavaScript code.

step: {id: string, name: string} or null if it doesn't exist.

stage: {id: string, name: string} or null if it doesn't exist.

language: string or null if it doesn't exist.

locale: string or null if it doesn't exist.

isCloud: Boolean

isPreview: Boolean

isReadonly: Boolean

isDisabled: Boolean

isPrint: Boolean

isAnonymousUser: Boolean

isDraft: Boolean

pageURL: string

The LFForm Interfaces

getFieldValues

Gets the value of the specified fields.

Examples:

setFieldValues

Sets the value of the specified fields.

Examples:

showFields

Shows the specified fields. This function can affect table/collection row/set templates.

Examples:

hideFields

Hides the specified fields. This function can affect table/collection row/set templates.

Examples:

disableFields

Disables the specified fields. This function can affect table/collection row/set templates.

Examples:

enableFields

Enables the specified fields. This function can affect table/collection row/set templates.

Examples:

changeFieldSettings

Changes settings on the specified fields. This function can affect table/collection row/set templates.

Examples:

changeFormSettings

Change the settings on the form.

Examples:

changeActionButton

Change the label of a single action button. Buttons include the Submit, Approve, and Reject submission actions, the Save as Draft button, and user defined custom submission action buttons on forms used by message start events and user tasks.

Example:

changeActionButtons

Change the label of a list of action buttons. Buttons include the Submit, Approve, and Reject submission actions, the Save as Draft button, and user defined custom submission action buttons on forms used by message start events and user tasks.

Example:

addRow, addSet

Adds new rows or sets to a table or collection.

Examples:

deleteRow, deleteSet

Deletes the specified rows or sets from a table or collection.

Examples:

addCSSClasses

Adds CSS classes to the specified fields. This function can affect table/collection row/set templates.

Examples:

Note: Adding CSS classes that were already on the field will not add duplicate classes.

removeCSSClasses

Removes the specified CSS classes from the specified fields. This function can affect table/collection row/set templates.

Examples:

Note: Attempting to remove CSS classes that were not on the field will be ignored.

findFields

Finds any fields that satisfy the specified arbitrary conditions.

Examples:

findFieldsByClassName

Finds fields with the specified CSS class.

Example:

LFForm.findFieldsByClassName("blue");

findFieldsByFieldId

Finds the fields with the specified field ID.

Example:

LFForm.findFieldsByFieldId(2);

findFieldsByVariableName

Finds the fields with the specified variable name.

Example:

LFForm.findFieldsByVariableName("Single_Line");

findFieldsByVariableId

Finds the fields with the specified variable ID.

Example:

LFForm.findFieldsByVariableId("90e0b201-5268-4ace-9f65-8ac32d12b58a");

subscribe

Subscribe to an event for a specific field.

Examples:

unsubscribe

Unsubscribe from events.

Examples:

onFormSubmission

Subscribe to the formSubmission event.

Examples:

Note: If the handler returns an object with an "error" property (for example {error: "There is something wrong on the form. Cannot submit."}), the submission is stopped and the error will be displayed as a popup message on the page.

onFieldChange

Subscribe to the change event for the specified fields.

Example:

LFForm.onFieldChange(() => console.log("change"), {variableName: "Single_Line"});

onFieldBlur

Subscribe to the blur event for the specified fields.

Example:

LFForm.onFieldBlur(() => console.log("blur"), {variableName: "Single_Line"});

onLookupTrigger

Subscribe to a lookup trigger event.

Example: 

LFForm.onLookupTrigger(function () {
    if (LFForm.getFieldValues({variableName: "TriggerField"}) === "NoCall") {
        return {cancelLookup: true};
    }
}, {lookupRuleId: 3}); // When lookup rule 3 is triggered, 
                   // if field with variable name "TriggerField" has value of "NoCall", 
                   // cancel the lookup call.

Note: if the handler returns an object with the "cancelLookup" property set to true, the lookup call will be canceled.

onLookupDone

Subscribe to the lookup done event.

Example: 

LFForm.onLookupDone(function () {
    if (LFForm.getFieldValues({variableName: "Lookup_Target"}) === "Hello") {
        LFForm.setFieldValues({variableName: "Lookup_Target_AutoComplete"}, "World!");
    }
}, {lookupRuleId: 2}); // after lookup rule 2 is done, check for Lookup_Target value. 
                   // If it is "Hello", set the Lookup_Target_AutoComplete to "World!"

Note: The rule ID refers to the rule's number in the Rules pane. For instance, "Rule 1" has an ID of 1, "Rule 2" has an ID of 2.