How to add option using MultiSelect jQuery plugin

问题

I am using the jQuery - MultiSelect 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/

回答1:

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

回答2:

try to use

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

回答3:

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.

来源：https://stackoverflow.com/questions/6459974/how-to-add-option-using-multiselect-jquery-plugin