Multi-Combobox

Datasource & Payload Mapping

The Multi Combobox expects an array of objects, where each object represents a selectable option.

Each object should include:

• a unique identifier used as the submitted value (keyExpression)
• a human-readable label displayed in the dropdown (modelDisplayValue)

Example datasource:

[
    { "userId": 1, "name": "Alice" },
    { "userId": 2, "name": "Bob" }
]

Example mapping configuration:

{
    "dataField": "selectedUsers",
    "keyExpression": "userId",
    "modelDisplayValue": "name"
}

When users select options, the component submits an array of values resolved from the property configured in keyExpression.

Example submitted payload:

{
    "selectedUsers": [1, 2]
}

Payload structure:

{
    "<dataField>": ["<keyExpression1>", "<keyExpression2>"]
}

Where:

• dataField defines the property name used in the request payload
• keyExpression1, keyExpression2 are values extracted using the keyExpression mapping

When emitObject is enabled, the component submits the full selected objects instead of only the mapped values.

Example payload with emitObject: true:

{
    "selectedUsers": [
        { "userId": 1, "name": "Alice" },
        { "userId": 2, "name": "Bob" }
    ]
}

This allows backend integrations to receive either lightweight identifier arrays or complete object representations depending on application requirements.