Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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/

like image 658
Clarence Klopfstein Avatar asked Jun 23 '11 20:06

Clarence Klopfstein


3 Answers

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' );
like image 159
D. G. Avatar answered Nov 17 '22 03:11

D. G.


try to use

$('.multiselect').multiselect('destroy');
$('.multiselect').multiselect();
like image 31
elf Avatar answered Nov 17 '22 04:11

elf


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.

like image 3
asologor Avatar answered Nov 17 '22 03:11

asologor