jquery multiselect reload

问题:

How can I add or remove options in JQuery UI Multiselect ? I am initializing the multiselect on page load and I need to remove existing values and add new values based on another selection. I am initializing the multiselect on page load using:

$("#multipleselectboxId").multiselect(); 

After that, I am adding values to the multiple drop down using jQuery append() and remove() methods which are working fine with original dropdown but in the multiselect are not getting reflected.

Can anyone help with this?

回答1:

For that one you could just destroy and reinitialize after changing...

$("#multipleselectboxId").append(toAppend).multiselect("destroy").multiselect(); 

There's also another plugin with a refresh function: EricHynds's Multiselect

$("#multipleselectboxId").append(toAppend).multiselect("refresh"); 

回答2:

I found the solution for this, first destroy the multiselect and reInitialize it, Thanks for @ Brandon Joyce,

solutions for this is

$("#multipleselectboxId").append(toAppend); $("#multipleselectboxId").remove(toRemove);  $("#multipleselectboxId").multiselect('destroy'); $("#multipleselectboxId").multiselect(); 

回答3:

I was trying to rebuild multiselect by .multiselect("destroy") and .multiselect(), but it wasnt working, so finally I find this solution worked for me.

$.each(jsonArray, function(i, val) {     $('#frmarticles-f_category_id').append('<option value="'+i+'">'+val+'</option>').multiselect('rebuild'); }); 

回答4:

well this plugin works fine but I have a pb with destroy and filter: my combo data are loaded with ajax. So, when I refresh the data with ajax call, I call destroy to refresh the plugin:

myCombo.multiselect('destroy'); myCombo.multiselect().multiselectfilter(); 

It works for the first call: empty combo, ajax call to load data, call the functions above. But if I refresh the combo data and call again the above functions, the filter disappeared? Someone experienced this pb before and found a solution?

回答5:

Thank you this helped. I was using multiselect UI widget and this is what worked

jQuery("select[title='" + FieldNameTitleText + "']").append( "<option value='" + OptionValue+ "'>" + OptionText + "</option>" ).multiselect("refresh"); 

回答6:

Here is what I did:; it may be more than necessary, but it worked for me.

Original "select" code that requires modification:

<select id="MySelect" name="selection"> <option value="1">One</option> <option value="2">Two</option> </select> 

I rebuild the option list in PHP, send it to the JavaScript via JSON, and construct/store the new list in a variable. E.g.:

// this is similar to if we got it from PHP var newList = '<option value="A">Alpha</option> <option value="B">Beta</option> <option value="C">Gamma</option>'; 

Now, to switch this around in the jQuery UI Multiselect widget:

$('#MySelect').html(''); // clear out old list $('#MySelect').multiselect('destroy');  // tell widget to clear itself $('#MySelect').html(newList); // add in the new list $('#MySelect').multiselect(); // re-initialize the widget 

In particular, I re-initialized it with parameters, e.g.:

$('#MySelect').multiselect({selectedList: 4, header: false}); 

If anybody has read this far down and is still having troubles, give this a try.

回答7:

In my case, I just wanted to replace all previous content of multiselect with new.

This worked for me:

$('#multiselect_id').html(newHtml); $('#multiselect_id').multiselect('refresh'); 

回答8:

I used it in this way :

$("#<%= cmbInBayiID.ClientID %>").multiselect().trigger('reset'); 

It worked.

回答9:

For wenzhixin MultiSelect:

var i = jQuery('input'); i.data('multipleSelect').$parent.remove(); i.removeData('multipleSelect'); i.show(); 

回答10:

    function setMultiSelect(idElement, paramVal){         eval("$('#"+idElement+"').multiselect('uncheckAll')");         $.each($('input[name="multiselect_'+idElement+'"]'), function(k,i) {                 if(paramVal.indexOf(this.value)!=-1){                 this.checked = true;              }         });           eval("$('#"+idElement+"').multiselect('update')");     }    

回答11:

var valArr = ["1", "2"],          i = 0,       size = valArr.length,   $options = $('#MySelect option');  for (i; i < size; i++) {   $options.filter('[value="' + valArr[i] + '"]').prop('selected', true); }  $('#MySelect').multiselect('reload'); 

1.valArr is values of select Options
2.for loop to set selected to matched option based on valArr
3.our changes is only in hidden select element
4.to change in multiselect generated elements we need to reload
5.every pluggin may have different name to reload eg:update,refresh

文章来源: jquery multiselect reload