Zusee Weekin
Zusee Weekin

Reputation: 1358

Refresh Jquery multi chosen select

How to remove selected items from jquery multi chosen select after click on reset button?

<select data-placeholder="Select" id="options" class="chosen-select" maxwidth="50px" multiple tabindex="15" ></select> 

I have tried several ways with no luck. This is my code:

    $("#options").multiselect('refresh');
    $("#options").multiselect('clearSelection');
    $('#options').multiSelect('deselect_all');
    $("#options").find('option:selected').removeAttr("selected");

After above still display selected items as in the image,

enter image description here

Any help would be appreciated.

Upvotes: 1

Views: 3269

Answers (3)

Chris O&#39;Kelly
Chris O&#39;Kelly

Reputation: 1893

That's not a multiselect, it's a jQuery chosen field, it looks like. the answer here covers you: 'select all' and 'remove all' with chosen.js - just remove the selected property from options then update the chosen element

$("#options").find('option:selected').prop('selected',false);
$("#options").trigger('chosen:updated');

If you are using an older version of chosen, then the correct trigger for you might be: liszt:updated, eg.

$("#options").trigger('liszt:updated');

But you'd need to add that detail to the question for me to say for sure.

As an aside, if you have ALSO initialized this as a multiSelect, I predict problems in your future. I would ascertain for certain which widget you WANT to use, and make sure you only initialize it/call methods on it as that widget, and that widget only

Upvotes: 3

Văn Tuấn Phạm
Văn Tuấn Phạm

Reputation: 659

You can use:

$("#options").find('option:selected').removeAttr("selected");

Example: https://jsfiddle.net/hs9yft2n/1/

Upvotes: 0

Logan McCaul
Logan McCaul

Reputation: 36

I'm not too familiar with multiselect, but according to the docs it looks like you can deselect all by using:

$('#your-select').multiSelect('deselect_all');

Upvotes: 0

Related Questions