Conditional list elements (dataMember/dataMemberValue)

Description

List elements can be dynamic and conditional

Use case

You want to hide or display certain elements based on the response data

How to set it up

You modify the desired Lists in Mobile Configuration Files

Example: Customize how Quantity is displayed on Order List page

Based on integer value in "Status", different images are displayed

<listConfiguration id="Orders" displayStatus="true">
 <columns>
  <column width="90%" xAlign="left" yAlign="top">
   <elements>
    <textElement fontId="headlineFont" text="{DisplayLine1}"/>
 	<textElement fontId="contentFont" text="{DisplayLine2}"/>
 	<textElement fontId="contentFont" text="{DisplayLine3}"/>
 	<textElement fontId="contentFont" text="{DisplayLine4}"/>
 	<textElement fontId="contentFont" text="{DisplayLine5}"/>
   </elements>
  </column>
  <column width="10%" xAlign="right" yAlign="center">
   <elements>
     <imageElement width="6" dataMember="Status" horizontalAlignment="right" verticalAlignment="bottom">     <--- You must send out the value 'Status' in the GetOrders -response
 	  <values>
       <value imageId="locked" dataMemberValue="2"/>
       <value imageId="attachment" dataMemberValue="3"/>
 	  </values>
 	 </imageElement>
 	</elements>
   </column>
 </columns>
</listConfiguration>
</..>

Example: Customize how Quantity is displayed on Order Lines page

Based on boolean value 'MyCustomBooleanValueHere', different Quantities are displayed

<listConfiguration id="OrderLines" displayStatus="true">
<rows>
 <row>
  <columns>
   <column xAlign="left">
    <elements>
     <textElement fontId="headlineFont" text="{DisplayLine1}" verticalAlignment="top"/>
    </elements>
   </column>
   <column xAlign="right" yAlign="top">
    <elements>
     <textElement dataMember="MyCustomBooleanValueHere" fontId="headlineFont" horizontalAlignment="right" verticalAlignment="top">       <--- You must send out the value 'MyCustomBooleanValueHere' in the GetOrderLines -response
      <values>
       <value dataMemberValue="false" text="{ActionDefinedQuantity}/{Quantity}"/>    	<--- The default element
       <value dataMemberValue="true" text="{Quantity}"/>							    <--- The custom element
      </values>
     </textElement>
    </elements>
   <..>

Display Status

All lists can have a color indicator in the left or right hand side. By default, this is enabled on the order list, and order lines page, where Blue indicates that a line has no registrations, Orange indicates that registration have begun, and Green means that the registrations are completed. This is however configurable, and can be used to indicate custom status as well.

Enable the status bar for any list by setting displayStatus="true", and creating a displayStatusConfiguration in the specific list configuration.

<listConfiguration ... displayStatus="true">
   <displayStatusConfiguration dataMember="Variant" placement="right">
      <values>
         <value dataMemberValue="Small" color="#e88a30"/>
         <value dataMemberValue="Large" color="#008000"/>
      </values>
   </displayStatusConfiguration>
   ...
</listConfiguration>

The dataMember attribute in the displayStatusConfiguration defines which element to look for in the returned response from the backend. The values section defines which colors to display when the dataMember has a certain value. It can work with any returned element in the response from the backend.

In the example above the attribute to look for is the Variant value for a LookupResponse. And whenever the value is Small or Large, a different color will be displayed as defined in the values element.

Support Knowledge Base