JavaScript API
From version 2.7, TerraForm includes a simple JavaScript API designed to get and set field values as well as to enable and disable fields. THe supports almost all TerraForm fields.
All fields may now be referenced by ID. When you create a field, TerraForm will assign it an ID automatically. Alternateively, you may specify your own ID (use the id
attribute). TerraForm will assign an ID as follows:
terraForm.[formName].[fieldName]
where [formName] is the name of the form, and [fieldName] is the name of the field. If there are several fields with the same name, then the ID will be as follows:
terraForm.[formName].[fieldName][x]
where [x] is the ordinal number (1, 2, 3,...) of the field with that name on the form.
Refer to a specific field like this:
document.getElementById('[ID]')
For example:
<tag:terraform name="calculator" alwaysdisplayform="yes" > <messagesblock> <div class="error"> <messages> </div> </messagesblock> <tag:terrafield name="number1" datatype="integer" size="3" /> <tag:terrafield name="number2" datatype="integer" size="3" /> <tag:terrafield name="sum" caption="Add values" format="button" onclick="alert(parseInt(document.getElementById('terraForm.calculator.number1').value)+parseInt(document.getElementById('terraForm.calculator.number2').value))" /> </tag:terraform>
TerraForm provides the following methods:
-
getDisabled()
Returns true if the field is disabled, and false if not.
-
setDisabled(value)
Sets the disabled state of the field (value
is true or false).
-
toggleDisabled()
Reverses the disabled state of the field.
-
getValue()
Returns the value of the field. This is particularly useful for composite fields such as date pickers.
-
setValue(value)
Sets the value of the field. This is particularly useful for composite fields such as date pickers.
Call methods like this:
terraFormApi.fields['terraForm.[formName].[fieldName]'].getValue();
For example:
<tag:terraform name="toggleForm" > <tag:terrafield name="myField" format="datepicker" default="#now()#" /> <tag:terrafield name="toggleDisabled" caption="toggleDisabled()" format="button" onclick="terraFormApi.fields['terraForm.toggleForm.myField'].toggleDisabled()" /> <tag:terrafield name="getValue" caption="getValue()" format="button" onclick="alert(terraFormApi.fields['terraForm.toggleForm.myField'].getValue())" /> </tag:terraform>