CODEWITHSUNDEEP
javascriptjqueryhtmljquery-pluginsappend
Shahid Ghafoor
Shahid Ghafoor

Reputation: 3103

dynamically add new option in jquery chosen plugin where select multiple

I am using choose master http://harvesthq.github.com/chosen/

Example

<select data-placeholder="Click to Select Role..." style="width:200px;"  id="geoRange" name="geoRange" class="chzn-select" tabindex="8" multiple>
<option value="1">England</option>
</select>

I am adding new option in this select 

$('#geoRange').append( new Option('USA',2) );

It is not working

How can I add new option?

Upvotes: 1

Views: 6563

Answers (3)

Shahid Ghafoor
Shahid Ghafoor

Reputation: 3103

$('#geoRange').append( new Option('USA',2) );

The following statement solve my problem 

 $("#geoRange").trigger("liszt:updated");

Upvotes: 0

user234932
user234932

Reputation:

After updating the select list, you apparently need to also notify Chosen that you did that.

$("#geoRange").trigger("liszt:updated");

I haven't used Chosen myself (using Select2 instead), but that's what the docs say. See http://harvesthq.github.com/chosen/

Upvotes: 4

polin
polin

Reputation: 2845

    <script type="text/javascript">
function fnc()
{
var select1 = document.getElementById("geoRange");
select1.options[select1.options.length] = new Option('USA', 2);
}
</script>
</head>

<body>
<select data-placeholder="Click to Select Role..." style="width:200px;"  id="geoRange" name="geoRange" class="chzn-select" tabindex="8" multiple>
<option value="1">England</option>
</select>
<input type="button" onclick="fnc()" value="click me" />

Upvotes: 0

Related Questions