Data Binding

The data map for the Bootstrap select component is listed below. The component expects these field names in its data configuration.

Properties

Name

Description

value

The field in the data to be used as the value for the select option

label

The field in the data to be used as the display label

selected

Optional. The field in the data to determine which value should be selected

const users = [
    { value: "bsimmons", label: "Ben Simmons", selected: false },
    { value: "jembiid", label: "Joel Embiid", selected: true }
]

const select = new wire.bsSelect().render("#select", {
    data: users
});

Datamap

Use the datamap configuration property to bind a data structure to the component that does not have the same field names.

const users = [
    { user: "bsimmons", name: "Ben Simmons" },
    { user: "jembiid", name: "Joel Embiid" },
]

const select = new wire.bsCheckboxes().render("#select", {
    data: users,
    datamap: { id: "user", label: "name" }
});

Last updated