Development tools : XUI editor : Generating an XUI page from context data
  
Generating an XUI page from context data
To accelerate the development of XUI pages, you can generate XUI pages by associating the data elements from a context of an operation or a flow to UI widgets through the Transaction editor.
Note Data elements are associated to specific UI widgets by default. You can change and specify the UI widget, or by using the View generation from data window as described in step 9 of the procedure in this topic.
To generate an XUI page by associating the data elements from the context of an operation or a flow to UI widgets
1 Open the operation or the flow file that contains the data elements that you are using to generate the XUI file.
2 In the Transaction Dashboard, double-click the Derive that is located between Context and User Interface.
The View generation from data window opens.
Note If you are using the UDTT perspective to generate the XUI page, you can right-click the operation or flow file in the Project Explorer view, and then click Generate view to open the View generation from data window.
This graphic is described in the surrounding text.
3 In the "Select the parent folder" pane of the "View generation from data" window, select the folder in which you want to save the XUI file that is generated.
4 In the File name field, enter a name for the XUI file.
5 Optional: From the Template list, select the template that you want to use to generate the XUI file.
The xui template must have a container widget.
There should be a container widget named 'mainForm'.
The container widget named 'mainForm' should not be a tabbed pane.
The 'mainForm' container should be empty.
6 Click Next.
7 From the Context list, select the data elements that you want to include as UI elements in the XUI file, and then click Add.
Note The data elements that are available for selection in the Context list are the data elements from the context that is bound to the flow or operation. If you want to associate data elements from a different context to UI elements, you must change the context that is bound to the flow or operation. For information on how to bind a context to a flow, see Binding context to a UDTT Flow.
This graphic is described in the surrounding text.
8 Click Next.
Note If you click Finish, the XUI page generates and displays. If you did not specify the UI widgets that you want to associate to the data elements, the UI widgets that are associated to the data elements by default are created in the XUI page. To specify the UI widget that you want to associate to a data element, click Next instead of Finish, and proceed to the next step.
9 From the Data Element list, select a data element to modify the UI widget that it is associated to and to modify the properties of the UI widget. In the Label field, specify the text that is displayed on the label next to the UI widget on the XUI page. Click Finish.
This graphic is described in the surrounding text.
If you are generating a list to a table, the inner data would be inherited into table columns and each UI widget would be inherited to the column widget except if the widget is:
Not column widget, no widget will be assigned to the column.
Labels or Text Box, no widget will be assigned to the column.
Combo or SelectList, LabelForList will be assigned to the column.
For inherited column widget properties,
Column Title: Label
If no label is defined for the data element the column title should be left empty.
Properties that have the same name would also be inherited (for example urlForList).
Result
The XUI page is generated.
This graphic is described in the surrounding text.
Go up to
XUI editor