Creating an Enhanced Page state

Development tools : Transaction editor : Drawing flows in the flow editor : Creating an Enhanced Page state

You can use Enhanced Page state to start and refresh a flow inside one container. It supports updating one or multiple specific areas of view on the page from back end flow.

1 In the UDTT Project Explorer view, double-click the transaction file that you want to add the Enhanced Page state to.

2 Click Enhanced Page in the State panel and click in the Flow editor.

Click the EnhancedPage icon and click in the editor

3 Specify the main page that is bound to the Enhanced Page state in the Properties view:

▪ Click the Browse icon next to the Main Page field. The Selector window opens.

▪ Select the page file to be displayed for the Enhanced Page state and click OK.

4 In the Name field, input a valid state name.

5 In the Sub-page elements section, add a new entry by clicking the Add icon This graphic is described in the surrounding text.

6 Select the sub page, whose context is to be loaded to the container:

▪ Click the <EMPTY> cell in the Sub page column. The Select a Page window opens.

▪ Select a XUI page and then click OK.

Note If the main page contains a Form, you cannot select an XUI page that also contains a Form. Embedded Forms in page is not supported.

7 Select the container widget for the Enhanced Page state:

▪ Click the <EMPTY> cell in the divId column. The Container widget select window opens.

▪ Select a static Page container or bind the dynamic context data to the divId property.

8 To select a Page container, follow the instructions on the Page tab.

Select the container widgetin the Container widget select window

9 To bind the dynamic context data to divId, select a context data from the list on the Context tab and then click OK.

10 To bind the dynamic context data to a Repetitive Panel:

▪ Select the widget id from the list on the Context tab, and then click OK.

▪ Click the Add icon This graphic is described in the surrounding text.

next to the Output Mapping field. The Output Data Mapping window opens.

▪ Select the global function from the Mapping Source list.

▪ Define string1 by clicking the cell in the Value column for string1, and then input a value in the format of '<XUI_PAGE_NAME>_<WIDGET_ID>_' in the "Please select a value" window.

▪ Define string2 by clicking the cell in the Value column for string2, and then select the value of the dataNameForRow property that is defined for the Repetitive Panel.

▪ Select the target from the Mapping Target list.

▪ Click Bind, and then click OK.

11 Select the event by completing the following steps.

▪ Click the empty cell of the new entry in the Event column. The "Please select an event id" window opens.

▪ Select an event that points to the current Enhanced Page state, and then click OK.