Most form components have design time options to set various control properties like Required and Disabled. In some cases, it might be desirable to set those properties conditionally based on other parameters of the form. The the form attached to this page demonstrates a checkbox component controlling the state of a Text Area.
In this example:
- When Is Required is not checked, Description is disabled and does not contain the required property.
- When Is Required is checked, Description is enabled and marked required.
- When a user unchecks Is Required, the Description text area goes back to its original state and is clear of any text previously entered.
The logic to support this behavior is performed in a conditional rule on the text area component.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
if (data.isRequired)
{
component.validate.required = true;
component.disabled = false;
}
else
{
component.validate.required = false;
component.disabled = true;
data.description = '';
}
show = true; |