How to clear the select boxes

Question

I am hoping this will be a simple answer, I have used chosen drop downs for filtering the records. I have added another button for reseting the filter values.

I want to clear the chosen drop down on the "Reset" click.

I did try changing the selected values, but no luck.

Any pointers?

tried setting the value to blank: $(".category-filter").val(""); — Sudhir Kesharwani, Jan 17 '14 at 16:40
and other thing i tried is to set first option as selected: $(".psl-filter").find('option:eq(0)').prop('selected', true); — Sudhir Kesharwani, Jan 17 '14 at 16:41
possible duplicate of [How do I reset a jquery-chosen select option with jQuery?](http://stackoverflow.com/questions/11365212/how-do-i-reset-a-jquery-chosen-select-option-with-jquery) — James Wilson, Feb 18 '14 at 20:30

score 2 · Accepted Answer · answered Feb 07 '14 at 19:50

2

Finally got answer to my question, it was asked in the GitHub for Choosen plugin.

Here is the code that works like charm:-

          $('.dropdownclass option:selected').removeAttr('selected');
          $('.dropdownclass').trigger('chosen:updated');

Hope this helps..

answered Feb 07 '14 at 19:50

Sudhir Kesharwani

311
3
14

With newer jQuery you need to use the `.prop('selected', false);` like `$('.dropdownclass option:selected').prop('selected', false); $('.dropdownclass').trigger('chosen:updated');` – Anima-t3d Dec 22 '17 at 05:59

James Cat Sprocket · Answer 2 · 2014-01-17T17:13:17.960

0

your answer:

$(".category-filter").val("")

Should work if its got the class "category-filter", and attached in the button .click() function, and within the document.ready function. - Is the option value "" actually a select option that can be selected? as I believe it needs to be for this to work?

A fiddle to show..

http://jsfiddle.net/UmV6p/3/

edited Jan 17 '14 at 17:13

answered Jan 17 '14 at 16:51

James Cat Sprocket

21
5

James, this works for default select box, however i am formatting it using the Choosen plugin, and code above is not having any impact so far. – Sudhir Kesharwani Jan 21 '14 at 20:29

score 0 · Answer 3 · answered Jan 21 '14 at 15:55

0

You would need to first reset it and then update chosen dynamically.

$(".category-filter").val(""); 

$(".category-filter").trigger("chosen:updated");     //version v1.0.0

$(".category-filter").trigger("chzn:updated");     //other than version v1.0.0

Hope this helps.

answered Jan 21 '14 at 15:55

msapkal

8,268
2
31
48

Mahesh, sorry but this didn't worked either. – Sudhir Kesharwani Jan 21 '14 at 20:27

How to clear the select boxes

3 Answers3

Linked