CODEWITHSUNDEEP
jqueryjsontwitter-bootstraptwitter-bootstrap-3bootstrap-multiselect
Thakhani Tharage
Thakhani Tharage

Reputation: 1298

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);

Upvotes: 1

Views: 2165

Answers (2)

zero
zero

Reputation: 2104

@KyleMit for me instead of title, label works..

var data = [{
    label: 'First group',
    children: [{ label: 'Cheese', value: 'cheese' }, 
               { label: 'Tomatoes', value: 'tomatoes' }]
    }, {
    label: 'Second group',
    children: [{ label: 'Mozzarella', value: 'mozzarella' }, 
               { label: 'Mushrooms', value: 'mushrooms' }]
}];

$('.multiselect').multiselect('dataprovider', data);

Upvotes: 1

KyleMit
KyleMit

Reputation: 30327

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>

Upvotes: 3

Related Questions