Creating applications : Creating applications : HTML HelloWorld sample : Overview of HTML HelloWorld sample : UI design and data binding of the sample
  
UI design and data binding of the sample
The following figure displays the design of the sample AccountMain XUI page that is created with the XUI editor.
This graphic is described in the surrounding text.
The AccountMain XUI page contains these sections:
Account Information section
Displays the account details.
The Account Number list is a selectionList widget.
The Sub accounts list is displayed in a table widget.
Transaction section
Performs the withdraw transaction.
Text widgets are used to display the data from the sub account that can be used for the withdrawal transaction. These text fields are filled with data automatically according to the ECA rules. When a user selects another account number, the sub account list is refreshed through an AJAX calling operation.
The dataName property of each widget on the page can be used to bind the widget to a data element in the context. The Account Number list and text fields in the transaction section are bound to a flow context. The Sub accounts list is bound to the context of the GetSubAccountDetailsOp operation, which is called by AJAX.
Go up to
Overview of HTML HelloWorld sample