How to add option using MultiSelect jQuery plugin

I am using the jQuery - Mult开发者_运维知识库iSelect plugin.

I want to be able to add an option to my initial select box, and then have the MultiSelect user interface update with the new option.

Here is what I have (which doesn't work).

var value = $("#newGroup").val();
$('#Select1').append("<option value=\"" + value + "\">" + value + "</option>");

Then I've tried to call the same code to recreate the multiselect along with other options like destroying it first.

Here is the code I use to implement the plugin.

$("#Select1").multiselect({ sortable: false, searchable: true });

Here is the plugin's home page: http://quasipartikel.at/multiselect_next/

Do you have the latest version of MultiSelect? Version 1.8 now adds a refresh command that is designed to update lists to reflect newly appended or deleted options. Your code sequence should be:

var value = $("#newGroup").val();
$('#Select1').append("<option value=\"" + value + "\">" + value + "</option>");
$('#Select1').multiselect( 'refresh' );

try to use

$('.multiselect').multiselect('destroy');
$('.multiselect').multiselect();

For old versions you can try this

$('select').multiselect('destroy').removeData().multiselect();

'destroy' method doesn't remove data from the select node so when you try to initialize it again it thinks that it already initialized. removeData() solves the problem.

New versions has 'refresh' method so you can append some options to the select and call

$('select').multiselect('refresh');

when multiselect already initialized.

Even i was stuck into something like this means when i appended the option into select after that it wasn't updating the multiselect so i got this below solution.

$('#Select1').append("<option value=\"" + value + "\">" + value + "</option>");

After this add this line.

$('#Select1').multiselect('rebuild');

And it will rebuild the multiselect with the newest data added also.