Table API (Client)
Overview
To interact with specific fields on the form on the client side, we have a variety of functions and methods you can use to make fields read only, required and more.
The majority of these can be accessed in the following way. Where if there are exceptions, it will be explicitly mentioned.
//Commonly in this format.
current.<FieldName>.<FunctionName>();
//As an example, this would work.
current.RequestedFor.required(true);You can also set the value of a field by passing it in as a parameter, such as the following.
//Normal format to set a value.
current.<FieldName>(<value>);
//As an example, this would work
current.ShortDescription("This is a short description");In addition to this, on the client side you can get the display value and actual value of fields. Although for some fields, values will be the same as the display values (such as strings), this will not be the case for reference fields.
To get a field’s value or display value, you can do the following.
//To get the underlying value of a field.
current.<FieldName>()
//As an example, this would work. This would return an ID.
current.RequestedFor()
//For the display Value, you could do the following.
current.<FieldName>>.displayValue()
//As an example, this would work. This would return a name.
current.RequestedFor.displayValue()Functions available
Function | Returns | Description |
|---|---|---|
.existsOnForm() | Boolean | This returns whether or not the field shows up on the form. |
.fieldLabel() | String | This returns the field’s label as a string. |
.fieldType() | String | This returns the field type as a string |
.getCssClass() | String | This returns the CSS class that has been applied via a UI event or otherwise. |
.readOnly(boolean) | N/A | This makes a field read only. |
.required(boolean) | N/A | This makes a field mandatory / required. |
.setCssClass() | N/A | This sets the class of a field (which you can add as a portal style or otherwise). |
.visible(boolean) | N/A | This shows / hides a field on the form. |
.ignoreHasChanged(boolean) | N/A | Allows a field to be set by a script, but will not cause the form to be marked as ‘dirty’. |
Layout Element Behaviour
To use this functionality, you need to be on Version 1.10 or later.
In certain situations, you may wish to hide and show a whole section or specific layout element, which is not a field. This includes items such as headings, information panels, tabs and more. To achieve this, we have added an additional function to the current object getUIElements("<FORMID>").
To understand how this works this article will use a specific example.
As an initial step, the layout element you wish to show / hide, will need to be given a “Form ID”. This can be done by going to the form builder, hovering over the layout element in the form builder, clicking on the gear and giving it a “Form ID”.
Then, within a UI Event, you can refer to it and show and hide accordingly. Such as, if I wish to hide the container this refers to:
current.getUIElements("authentication-container").visible(false);However, if I want to make it visible again (such as if a field changes.
current.getUIElements("authentication-container").visible(true);Making a tab active:
One tab must be always the active tab. Hiding one tab and making another tab visible does not make the visible tab active. The hidden tab is still the active tab. In this case one tab needs to be changed to active:
current.getUIElements("authentication-container").selectTab();