I'm trying to change the currently selected option in a select with the Chosen plugin.
The documentation covers updating the list, and triggering an event when an option is selected, but nothing (that I can see) on externally changing the currently selected value.
I have made a jsFiddle to demonstrate the code and my attempted ways of changing the selection:
$('button').click(function() { $('select').val(2); $('select').chosen().val(2); $('select').chosen().select(2); });
In order to change the selected option by the value attribute, all we have to do is change the value property of the <select> element. The select box will then update itself to reflect the state of this property. This is the easiest and most straightforward way of updating a select box state.
By default, pressing delete/backspace on multiple selects will remove a selected choice.
Chosen is a JavaScript plugin that makes select boxes user-friendly. It is currently available in both jQuery and Prototype flavors.
From the "Updating Chosen Dynamically" section in the docs: You need to trigger the 'chosen:updated' event on the field
$(document).ready(function() { $('select').chosen(); $('button').click(function() { $('select').val(2); $('select').trigger("chosen:updated"); }); });
NOTE: versions prior to 1.0 used the following:
$('select').trigger("liszt:updated");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With