How to configure the data binding

Owned by Alex Xie
Last updated: Nov 17, 2022

OneList data binding is capable of displaying the following information:

  • Static text   

  • Source data property

  • Combination of static text and source properties

How to create the binding expression

  • Select field or click on the  button to open the Source Properties Selector;
  • Select the property in the tree to setup the binding. Note: the tree only shows the properties that are valid for binding in the current context.

  • Continue the above step to bind multiple properties to the same field.
  • Optionally, edit the binging expression to
    • Change the order of the properties;
    • Add static text;
    • Add formatting.

Syntax of the binding expression

Path of the source property is enclosed with {}. The text including the {} braces is replaced with the value of the property. Texts outside of the {} are static and not changed.

FeatureExpressionDescriptionExample
Static textAny textDisplay a static text.

Source

n/a

Expression => Display

  • Header   =>  Header
Single properties{Property}Display the value of the bound source property.

Source

{
    "PO_NUMBER": "4500010000",

    "PO_ADDRESS": {

          "CITY1": "Sydney"

     }
}

Expression => Display

  • {PO_NUMBER}                => 4500010000
  • {PO_ADDRESS.CITY1}   => Sydney
Multiple property{Property1} {Property2}Display the concatenation of the value from multiple properties. 

Source

{
    "CostCentreId": "1234",

    "CostCentreName": "Sales Office"
}

Expression => Display

  • {CostCentreId} {CostCentreName}    => 1234 Sales Office 
Combination of static text and propertiesText1 {Property1} Text2 {Property2}Combining static text (including space) and properties to display more descriptive information or complete sentences.

Source

{
    "OrderQuantity": 10,

    "UnitPrice": 10.00

    "UoM": "EA"
}

Expression => Display

  • Quantity: {OrderQuantity} {UoM} @ ${UnitPrice} / {UoM}  =>  Quantity: 10.00 EA @ $10 / EA
Date and time format
  • {Property:dd/MM/yyyy}
  • {Property:yyyy-MM-dd hh:mm:ss}
Display date and time in specific format. More detail of date & time format can be found at: https://docs.microsoft.com/en-us/dotnet/standard/base-types/custom-date-and-time-format-strings

Source

{
    "CreatedOn": "2019-06-24T14:00:00+00:00",

    "ModifiedOn": "2019-06-30T10:10:00+00:00"

}

Expression => Display

  • {CreatedOn:dd/MM/yyyy}                  =>  24/06/2019
  • {ModifiedOn:dd/MM/yyyy hh:mm}     =>  30/06/2019 10:10
Number & currency format

{Property:#.00}

{Property:#.c}

Display number in specific format. More detail of number format can be found at: https://docs.microsoft.com/en-us/dotnet/standard/base-types/standard-numeric-format-strings 

Source

{
    "OrderQuantity": 100.0,

    "Weight": 12.50,

    "Amount": 1500.50,

}

Expression => Display

  • OrderQuantity:#}       => 100
  • {Weight:#.0}              =>  12.5
  • {Amount:#,###.00}    =>  1,500.50
Array element

{ArrayProperty[Index]}

{ArrayProperty[Index].Property}

Display the text in an string array at the specific index, display a property of the array element at the specific index. Note: index starts from 0.  

Source

{
    "Texts": ["Line 1", "Line 2"],

    "Items": [

        {"Title":"Item 0", "Value":0 },

        {"Title":"Item 1", "Value":100 },

        {"Title":"Item 2", "Value":200 }

    ]

}

Expression => Display

  • {Texts[0]}              =>   Line 1
  • {Items[2].Title}      =>   Item 2
JSON path query{ArrayProperty[?(@.Property=='value to be searched')].ChildProperty}Evaluate the JSON Path Query at runtime and display the selected value. More detail about JSON Path can be found at: https://restfulapi.net/json-jsonpath/

Source

{
    "Items": [

        {"Title":"Item 0", "Value": 0 },

        {"Title":"Item 1", "Value": 100 },

        {"Title":"Item 2", "Value": 200 }

    ]

}

Expression => Display

  • {Items[?(@.Title=='Item 2')].Value}    =>  200

The above expression selects the element in the Items array where the element's Title property is 'Item 2' and binds to the element's Value property.

User defined variable {var-VariableName}Display the value of the user defined variable configured for the System.

User defined variables

{

   "Client": 200,

   "InboxUrl": "https://source.company.com/task.html"

}

Expression => Display

  • {var-Client} => 200

Additional binding configuration

Select the Binding Configurations tab in the Source Property Selector to setup additional binding configuration. 

A value converter is only required when the bound source property needs to be converted to number or date-time for formating:

  • DateTime Converter - converts a string to the native date-time value;
  • Double Converter - converts a string to a numeric value;
  • SAP Date Converter - converts SAP date string YYYYMMDD to the native date value;
  • SAP Time Converter - converts SAP time string to the native time value.

Use Regular Expression to fulfil advanced formatting requirement. More about regular expression can be found at: https://docs.microsoft.com/en-us/dotnet/standard/base-types/regular-expressions

RequirementRegex SettingExample
Remove leading zero.

Pattern: (^|\s)0+

  • 000123 Sales Office                           => 123 Sales Office
  • Cost centre: 0000123 Sales Office     => Cost centre: 123 Sales Office
Format a number that has only zeros

Pattern: (^|\D)0+(\D|$)

Replacement: 0,

  • 0000                          => 0
  • Batches: 000, 1         => Batches: 0, 1