How do I reset a jquery-chosen select option with jQuery?

by

Setting the select element’s value to an empty string is the correct way to do it. However, that only updates the root select element. The custom chosen element has no idea that the root select has been updated.

In order to notify chosen that the select has been modified, you have to trigger chosen:updated:

$('#autoship_option').val('').trigger('chosen:updated');

or, if you’re not sure that the first option is an empty string, use this:

$('#autoship_option')
    .find('option:first-child').prop('selected', true)
    .end().trigger('chosen:updated');

Read the documentation here (find the section titled Updating Chosen Dynamically).

P.S. Older versions of Chosen use a slightly different event:

$('#autoship_option').val('').trigger('liszt:updated');

More Related Contents:

  1. How can I use jQuery validation with the “chosen” plugin?
  2. Clear and refresh jQuery Chosen dropdown list
  3. jQuery Chosen plugin add options dynamically
  4. How to break out of jQuery each loop?
  5. How can I recognize touch events using jQuery in Safari for iPad? Is it possible?
  6. How to access the content of an iframe with jQuery?
  7. IE9 jQuery AJAX with CORS returns “Access is denied”
  8. jQuery Validate array input element which is created dynamically
  9. Jquery – Remove only text content from a div
  10. jQuery :contains() selector uppercase and lower case issue
  11. how to replicate pinterest.com’s absolute div stacking layout [closed]
  12. Change Twitter Bootstrap Tooltip content on click
  13. jQuery reversing the order of child elements
  14. How to update (append to) an href in jquery?
  15. How to Extend Twitter Bootstrap Plugin
  16. How do I implement onchange of with jQuery?
  17. Choosing a jQuery datagrid plugin? [closed]
  18. Dynamically add a class to Bootstrap’s ‘popover’ container
  19. Post Nested Object to Spring MVC controller using JSON
  20. How do I select a sibling element using jQuery?
  21. How to select all elements with a particular ID in jQuery?
  22. fancybox2 / fancybox causes page to to jump to the top
  23. Rails 3 UJS – controller gets called twice by link_to :remote
  24. jQuery trigger custom event synchronously?
  25. access div in iframe parent
  26. jQuery: using a variable as a selector [duplicate]
  27. jQuery detect click on disabled submit button
  28. jquery validation not waiting for remote validation to return true, considers form valid
  29. Listen to changes within a DIV and act accordingly
  30. Load JQuery into a Chrome extension?

Leave a Comment