Search code examples
jqueryjsontwitter-bootstraptwitter-bootstrap-3bootstrap-multiselect

Bootstrap multi select grouping dynamicaly using array


Is there a way to dynamically add grouping in multi select using this formation

var data = [
    {label: "ACNP", value: "ACNP"},
    {label: "test", value: "test"}
];
$("#multiselect").multiselect("dataprovider", data);

Solution

  • Yes, you can now add groups with dataprovider thanks to this pull request

    See the documentation on .multiselect('dataprovider', data).

    Demo in jsFiddle

    You can compose like this:

    var data = [{
        title: 'First group',
        children: [{ label: 'Cheese', value: 'cheese' }, 
                   { label: 'Tomatoes', value: 'tomatoes' }]
        }, {
        title: 'Second group',
        children: [{ label: 'Mozzarella', value: 'mozzarella' }, 
                   { label: 'Mushrooms', value: 'mushrooms' }]
    }];
    
    $('.multiselect').multiselect('dataprovider', data);
    
    <select class="multiselect" multiple="multiple"></select>