The JavaScript API allows access to HTMLB components in JavaScript programs. Every component which is capable of client side eventing, has to set the "jsObjectNeeded" attribute (inherited from the Component component) to TRUE so that the component can be accessed with the JavaScript API. See also the EventValidationComponent description for more details.
Using the InputField component
Syntax
Form form = (Form)this.getForm(); InputField inf2 = new InputField("currencyDisplay"); // Enable JavaScript object generation for access in JavaScript inf2.setJsObjectNeeded(true); inf2.setClientEvent(EventTrigger.ON_CHANGE, calculateCurrencyToFrom()"); inf2.setBCD("100"); inf2.setWidth("250px"); form.addComponent(inf2);
Getting the InputField object in JavaScript
Syntax
function calculateCurrencyFromTo(){ var funcName = htmlb_formid+"_getHtmlbElementId"; func = window[funcName]; var inputfield = eval(func("currencyDisplay")); // Now we have the inputField, so we can access it, for example // set a new value if (inputfield) inputfield.setValue("100.23"); }
Getting the InputField ID with Java
Syntax
The IdD of a HTMLB component is generate by the HTMLB API. To get the Id of a component use: InputField inf2 = new InputField("currencyDisplay"); String inputfieldID = pageContext.getParamIdForComponent(inf2); The inputfieldID can now be used to access the component: <script> var inputfield = eval(inputfieldID);</script>
The components that support client side eventing, like inputField and label, have a API for JavaScript that allow access and modification of the component on the client side.
enabled
A boolean value that indicates if the component is enabled (=true) or disabled (=false).
id
Identification code of the component.
Properties |
Methods |
---|---|
id |
setEnabled() |
isEnabled |
setDisabled() |
enabled
A boolean value that indicates if the component is enabled (=true) or disabled (=false).
id
Identification code of the component.
Properties |
Methods |
---|---|
id |
setEnabled() |
isEnabled |
setDisabled() |
enabled
A boolean value that indicates if the component is enabled (=true) or disabled (=false).
id
Identification code of the component.
value
Content of the inputField.
Properties |
Methods |
---|---|
id |
setEnabled() |
isEnabled |
setDisabled() |
setValue(value) |
|
getValue() |
checked
A boolean value that indicates if the component is checked (=true) or disabled (=false).
enabled
A boolean value that indicates if the component is enabled (=true) or disabled (=false).
id
Identification code of the component.
Properties |
Methods |
---|---|
id |
setEnabled() |
isEnabled |
setDisabled() |
setChecked(boolean) |
|
getChecked() |
checked
A boolean value that indicates if the component is checked (=true) or disabled (=false).
enabled
A boolean value that indicates if the component is enabled (=true) or disabled (=false).
id
Identification code of the component.
index
Index of selected entry of the list box, "top down", starting with 0.
option
An entry in the list box.
value
The key of an entry in the list box.
Properties |
Methods |
Comment |
---|---|---|
id |
setEnabled |
|
isEnabled |
setDisabled |
|
setIndex(index) |
Set the selected entry by index number. |
|
getIndex() |
||
addOption(key, visibleText) |
||
removeOption(key) |
||
setValue(Key) |
Sets the selected entry by key. |
|
getValue() |
Get key of the currently selected entry. |
Syntax
To get the radio button object use: function calculateCurrencyFromTo(){ var funcName = htmlb_formid+"_getHtmlbElementId"; func = window[funcName]; var rb = eval(func(htmlb_radiobuttonmodifier+"radiobutton")); . . }
enabled
A boolean value that indicates if the component is enabled (=true) or disabled (=false).
id
Identification code of the component.
Properties |
Methods |
---|---|
id |
setEnabled() |
isEnabled |
setDisabled() |
The htmlbevent object provides methods to get and set following information:
Method |
Description |
---|---|
htmlbevent.obj.getClickedColumn() |
Returns the column index of the column that has been clicked. |
htmlbevent.obj.getClickedRow() |
Returns the row index of the row that has been clicked. |
htmlbevent.obj.getClickedRowKey() |
Returns the row key of the row that has been clicked. |
htmlbevent.obj.getSelectedRow() |
Returns the index of the selected row (single select mode). |
htmlbevent.obj.getSelectedRows() |
Returns an array with the indices of all selected rows (multiple select mode). |
htmlbevent.obj.getSelectedRowKey() |
Returns the key of the selected row (single select mode). |
htmlbevent.obj.getSelectedRowKeys() |
Returns an array with the keys of all selected rows (multiple select mode). |
Syntax
myTable.setOnClientRowSelection("alert('You clicked on row with key '+htmlbevent.obj.getClickedRowKey()); alert('Selected rowkeys are: '+htmlbevent.obj.getSelectedRowKeys())");