Altova MobileTogether Designer

We will now create a table to display the orders of the customer that is selected on the top page by the end user. The orders are stored in the XML page source Orders.xml. Create the Orders table as follows.

 

1.Drag a Table control from the Controls Pane and drop it into the design.

2.In the New Table dialog that appears (see screenshot below), create the table as a dynamic table. Do this by selecting Dynamic number of rows. This will create a table with as many rows as there are corresponding row elements in the page source. Specify that the table has three columns and one header row (see screenshot below). Click OK to create the table.

MTDSPVOrdersTable01

3.From the Page Sources Pane, drag the Order element to the Repeating Row icon of the table in the design. Each order element will now correspond to one row of the table, and the order element will be the XPath context node of the table.

4.Drag a Label control from the Controls Pane and drop it into the first column of the header row. Type in Customer as the text of the label (see screenshot below). Create headers for the other columns similarly: Order and Amount.

5.Select all three header labels (by pressing Ctrl while selecting each label), and apply whatever label formatting you like in the Styles & Properties Pane.

6.Drag Label controls from the Controls Pane and drop them, respectively, into the three columns of the table-body row.

7.Select all three table-body row labels (by pressing Ctrl while selecting each label), and apply whatever label formatting you like in the Styles & Properties Pane.

 

The labels of the table-body rows have now been placed in the table cells. Their text will be specified via the XPath expressions described in the next section.

 

Create XPath expressions for the label texts

The table output we want is shown below. Notice the contents of the different columns.

MTDSPVOrderTableCust

To create XPath expressions for a label's text, first select the label. In the Styles & Properties Pane, select the label's Text property and click its XPath icon. (Alternatively, you can: (i) right-click the Text property and select Calculate with XPath, or (ii) select the Text property and click the XPath icon in the pane's menu bar.) In the XPath dialog that appears, enter the respective XPath expressions. Note that the XPath context node is the respective $ORDERS/Orders/Order element.

 

For the Customer column

 

if ($XML1/Root/CustomerCode!='All')  

then concat(CustomerCode, ': '$XML1/Root/CustomerName)  

else concat(CustomerCode, ': 'for $i in CustomerCode return $CUSTOMERS/Customers/Customer[@code=$i][1]/Name)  

 

For a table with orders of a selected customer, the customer name is obtained from the $XML1 tree.

For a table showing all orders, the customer name is retrieved from the $CUSTOMERS tree by using the customer code in the $ORDERS tree as the key. (The customer code is present in both trees.)

 

For the Order column

 

concat(@number, '/', OrderDate)  

 

For the Amount column

 

concat(Currency, ' ', OrderAmount)  

 

Finishing the Orders table

After having defined the contents of each column, format the labels as you like with properties from the Styles & Properties Pane. Now we have to specify the visibility property of the table row group so that only the customer that has been selected on the top page will be displayed in the table. The visibility property is described in the next section.

 

© 2018-2024 Altova GmbH