Question

2

Chosen.js multiple select values in javascript

rated 0 times [ 7] [ 5] / answers: 1 / hits: 20525 / 11 Years ago, thu, march 21, 2013, 12:00:00

I am using chosen.js to create a multiple select, but instead of processing the form in php, I am trying to use javascript to parse the values. My problem is that I cannot figure out how to retrieve the values from the multiple select.

I create the select with:

<select data-placeholder=Select a category... name=categories[] multiple style=width: 350px class=chzn-select>

and attempt to get the selected values using these javascript calls:

$('.chzn-select').chosen().val();

returns null

and

$('.chzn-select').chosen().val(0);

returns

{0:{jQuery19109988393174677814:730},length:1,prevObject:{0: {jQuery19109988393174677814:1,location:{}},context:{jQuery19109988393174677814:1,location:{}},length:1},context:{jQuery19109988393174677814:1,location:{}},selector:.chzn-select}

using JSON.stringify()

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

diane

Add To Favorites

Follow

Total Points: 264

Total Questions: 104

Total Answers: 95

Location: Liechtenstein

Member since Wed, Dec 8, 2021

3 Years ago

answered 11 Years ago zahrafrancisr · Accepted Answer

You mixed the use of chosen() and val().

The former transforms your select into a nice multiple select list, while the latter gets you the value(s) of the selected element(s).

So your JavaScript code would be:

// Transforms your select element

$(.chzn-select).chosen();



// Gets the selected value(s)

$(.chzn-select).val();

The val() method will return an array containing each selected option.

I quickly created a jsFiddle to show you how to use the plugin: when you click on the button, you will see the selected values in the console.