Designer 10.7 | webMethods CAF and OpenUI Development | Understanding the Client-side Model | CAF.Input.Model
 
CAF.Input.Model
UIInput controls extend the CAF.Output.Model with the CAF.Input.Model. In addition to the functionality of the CAF.Output.Model, the CAF.Input.Model enables registering the client-side value change listeners and validators for a given control.
A client-side value change listener is a method that takes three arguments:
*the control's client-side ID
*the control's old value
*the control's new value
Value change listeners are called when the control's value changes, after the value has already changed.
For example, you create a Dropdown control for which each option value is the client-side ID of a Hideable Panel control. You only display the Hideable Panel that is currently selected by the Dropdown control. You can add a value change listener to the Dropdown that triggers when the user changes the Dropdown selection state. The user action hides the previously selected Hideable Panel and displays the newly selected Hideable Panel. The following code shows how you can use a value change listener:
CAF.model('#{activePageBean.clientIds['myDropdownId']}').addValueChangeListener
(function(id, oldValue, newValue) {
var oldModel = CAF.model(oldValue);
var newModel = CAF.model(newValue);
if (oldModel)
oldModel.hide();
if (newModel)
newModel.show();
});
A client-side validator is a method that takes two arguments: the control's client-side ID, and the control's value. It returns an empty string if the control is valid, and a non-empty, error-message string if the control's value is invalid. For example, the following JavaScript registers a validator which validates that the input's value does not contain white space:
CAF.model('#{activePageBean.clientIds['myInputId']}').addValidator(function(id,
value) {
return (/\s/.test(value) ? "Cannot contain whitespace." : "");
});
For more information about CAF controls, see the webMethods CAF Tag Library Reference, as described in Finding Information about CAF Controls.
Related Topics