Plan details form JavaScript customization
This article describes the JavaScript customization capability in the Plan Details configuration. To access this, go to the Plan Details app and select a plan type. Then press the Validator JS Button. Each plan type will have its own validation code.
4 Tabs are available
Initialize:
Used to build validators and changers. This code will be run 1 time during form building and will not be run again
a form variable will be passed in which will allow you to add validators and changers
Load Plan
Used to process any plan related items every time a plan is loaded. This code will be executed every time the details form shows on the screen
a form variable will be passed in and can be used
Step Ids
Used if you will be needing process step information
Fields
List of fields and their internal names. Use the internal name to reference a field in the form
Object Functions available to use:
Form Functions
getField(fieldname)
validateField(fieldname)
validateAllFields()
Fields Functions
validators.push({})
Error: Message to show when validation fails.
OnChange: Set to true to validate when changing the field.
Steps: An array with the ids of steps you want to validate on when both changing a field value and when moving steps.
Fn: function for validating. Passes in a field and a step id.
Example:
form.getField("Name").validators.push({ Error: ‘Cannot be blank’, OnChange: true, Steps: ["aeaf7420-9040-44a4-3a67-b3c45ef10997"], Fn: function(field, step) { If(field.getValue() == “”) return false; } })
changers.push({})
Fn: Function when changing the value. Passes in the form, field, and step id:
form.getField("Name").changers.push({ Fn: function(form, field, step) { If(field.getValue() == “Some Name”) form.getField(“someField”).hide() } })
getValue()
setValue(v)
hide()Hide the field based on the response of a field.
show()
Example: Hide the field based on the response of a field.
form.getField("FlagField").changers.push({ Fn: function(form, field, step) { var fieldValue = field.getValue("FlagField"); if(fieldValue) form.getField('MultiBusinessField').hide() else form.getField('MultiBusinessField').show(); } });
Customizations
Add button to toolbar.
On init:
form.down("toolbar").add({
text: 'Test Button',
handler: function () {
var p = DetailsApp.GetActivePlan(this);
OnePlanCore.Plans.GetPlan(p).then(function (plan) {
//Do something with plan here
});
}
});