Monday, May 20, 2024
 Popular · Latest · Hot · Upcoming
194
rated 0 times [  195] [ 1]  / answers: 1 / hits: 51227  / 11 Years ago, thu, december 5, 2013, 12:00:00

I use bootstrap multi-select and I want to update options on flow with ajax



To populate on init my multiselect I do



<select name=model class=multiselect multiple=multiple>
<? foreach ($sel_models as $mod) { ?>
<option value=<?= $mod ?> <?= ($mod == $params['model']) ? 'selected' : '' ?>><?= $mod ?></option>
<? } ?>
</select>


then on event I would like to update my option list with the following ajax



I was trying to use the rebuild method but won't fire the drop-down after creation



 $.ajax({
type: 'post',
url: helper/ajax_search.php,
data: {models: decodeURIComponent(brands)},
dataType: 'json',
success: function(data) {
$('select.multiselect').empty();
$('select.multiselect').append(
$('<option></option>')
.text('alle')
.val('alle')
);

$.each(data, function(index, html) {
$('select.multiselect').append(
$('<option></option>')
.text(html.name)
.val(html.name)
);
});

$('.multiselect').multiselect('rebuild')
},
error: function(error) {
console.log(Error:);
console.log(error);
}
});


With firebug I can see that the list is generated but on select won't show up


More From » jquery

 Answers
77

In the doc I can read :



.multiselect('setOptions', options)
Used to change configuration after initializing the multiselect. This may be useful in combination with .multiselect('rebuild').



Maybe you can't change your widget data by your initial way. In a correct way you should use setOptions method.



Else : With your way, maybe should you think about destroy your widget .multiselect('destroy') and create it again after.



Update after comment :



In the doc : ( you've linked )




Provides data for building the select's options the following way:




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


So :
When you get data from your ajax call, you have to create an array of objects ( it's the options in the select you want to have ) with the format like



var data = 
[
{label: 'option1Label', value: 'option1Value'},
{label: 'option2Label', value: 'option2Value'},
...
]


When your objects array is created, then you just have to call the method



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


Where data is your array of objects.



I hope I'm clear :/


[#73893] Wednesday, December 4, 2013, 11 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
karladaijahf

Total Points: 78
Total Questions: 123
Total Answers: 89

Location: Liechtenstein
Member since Wed, Dec 8, 2021
3 Years ago
;