Observables

Many WireBootstrap components including the Bootstrap Select component in this example support one-way observable functionality. With this configured, any changes to the component will automatically update an object's property with the changed value. In addition, if the property initially contains a value, this value will be selected by default.

Model

To configure this observable functionality, set the model attribute's obj and property values as seen in the example below.

let user = { UserName: "jkratz" };

const select = new wire.bsSelect().render("#select", {
    ...
    model: { 
        obj: user, 
        property: "UserName" 
    },
});

Knockout Integration

When using Knockout, set the model attribute's ko value to the Knockout variable in order to keep the variable updated with changes.

let user = ko.observable("jkratz");

const select = new wire.bsSelect().render("#select", {
    ...
    model: { ko: user },
});

For more on the model configuration attribute and observables, visit the wire.ui.Component reference page.

Last updated