Chosen: How to programmatically set the value?

Created on 2 May 2012  路  24Comments  路  Source: harvesthq/chosen

I don't seem to be able to find much documentation for usage so I'm not sure how to set a chosen dropdown's value?

I tried using jQuery .val() which retrieves the value but doesn't seem to be able set it. If I don't use chosen then this method works fine on an ordinary select dropdown.

E.g.
var value = $("#chzn-select").val(); // Gets the value ok

var value = 1;
$("#chzn-select").val(value); // Doesn't set the value

Most helpful comment

I don't know if I have a more recent version of this but the below code works for me

$("#your-id").val("225").trigger("chosen:updated.chosen");

All 24 comments

you need to trigger the liszt:updated event when you change the underlying select element programmatically

Just like @stof said:

$("#chzn-select").val(value).trigger("liszt:updated");

Thanks guys, this worked for me

Documentation would be nice for that. :)

It is already documented

Thank you...

@thermech why are you talkign about down voting ? Reading the doc would give the uptodate version. As said above, it is documented (it was already documented the first time the question was asked btw)

Since V1.0

$("#chosen-select").val(value).trigger("chosen:updated");

Hi,

I tried with version 0.9.7

$("#field-license").val(license).trigger("liszt:updated");

I can see that the value is properly selected if I pull down the list but the label/text does not change

Any idea? However I need to use 0.9.7

@qlands on 1.0+, it works the same, except that you should trigger chosen:updated instead of liszt:updated

ok. But why the label/text does not change? What I mean is that after the user select an item that item is shown in the label on top of the search section. But with liszt:updated the item is selected buc the label is not updated. See image

chosen

@qlands Please link to a publicly accessible page (or a Fiddle) that shows the issue so we can attempt to reproduce.

Additionally, for support issues or usage questions (like this one) that are not bugs in Chosen itself, please post somewhere like StackOverflow, using the chosen.js tag. You'll be more likely to get a quick answer there.

I don't know if I have a more recent version of this but the below code works for me

$("#your-id").val("225").trigger("chosen:updated.chosen");

No need to add .chosen when triggering the event. This is the namespaced used for detaching event handlers

How do you select multiple items at once?
I want to set more than one item selected like in the picture in the same time
image

@cipster in case of a multiple select, jQuery expects an array for the .val() setter

@stof Thank you very much. It works with an array element.

Hi everyone>>
I am using Chosen1.1.0 .In that it has alist (M,L,K) so when i tried with following code it works.
jQuery("#wordChosen").val('M');
jQuery("#wordChosen").trigger("chosen:updated");
So chosed updated correctly.

But when i am trying lowercase like jQuery("#wordChosen").val('m'); its not working... how should i add a word like input text by jquery..Please help me..

thanks you about multiselect chosen with array.

Please can anyone help me on postback issues in asp.net. when I am going to select multiple options and click on button, everything is getting deselect and only one option is by default selected after postback.

@shaggygolvelkar The GitHub issue tracker is intended for bug reports, specific feature requests, and submitting pull requests.

For support issues or usage questions like yours, please post somewhere like StackOverflow, using the chosen.js tag. You'll be more likely to get a quick answer there.

How do I populate the chosen value from controller. I am using multiple chosen select and from the controller when I try to open my form in the edit I am not getting value populated in the drop-down field.
So if I have selected 3 drop down item then whenever I will open my form that 3 items must be present in the drop down field with ability to add or remove items from the drop down list. How I will do that. Any suggestion.

Please help me... i have chosen drop down list in my page.there is input filed to search.but i have another input filed outside.I want to search in chosen drop down list from the outside input filed like chosen inner input field...please..

image

Was this page helpful?
0 / 5 - 0 ratings

Related issues

asvetlenko picture asvetlenko  路  3Comments

mcclurem picture mcclurem  路  4Comments

piercemcgeough picture piercemcgeough  路  5Comments

SFPink picture SFPink  路  4Comments

scottdoc picture scottdoc  路  7Comments