user1532468
user1532468

Reputation: 1751

Chosen plugin not updating dynamic content

I am using http://harvesthq.github.io/chosen/ in multiple mode and it dosen't seem to update after submitting. All I get is a blank input box and in the dropdown, the entry I just submitted is still there. I know the entry is getting submitted because of the json return. If I refresh the page, the entry is no longer in the dropdown and the default I use is there. Where have I gone wrong with my coding.

Many thanks

$("#box_rtv").val('Choose a box...').trigger("chosen:updated");
<select data-placeholder="Choose a box..." class="chosen-select required" multiple="multiple" style="width:250px;" name="box_rtv[]" id="box_rtv">

Upvotes: 0

Views: 1539

Answers (3)

darkman97i
darkman97i

Reputation: 190

In case you remove and option these actions going right in this order:

$('#user_id').val(''); // to clean the select ( otherwise not refreshing correctly )
$("#user_id option[value='okmAdmin']").remove(); // remove some option element
$('#user_id').trigger("chosen:updated"); // 

Upvotes: 1

Praveen
Praveen

Reputation: 56539

The way you're calling the .trigger() is wrong.

$("#box_rtv").val('Choose a box...').trigger("chosen:updated"); //WRONG

Instead simply

After appending all the values to the select, just trigger as mentioned below

$("#box_rtv").trigger("chosen:updated");

Upvotes: 1

rink.attendant.6
rink.attendant.6

Reputation: 46307

First of all, you're triggering the event on a string with your code, as .val() returns a string. Try doing it separately, or in a different order while chaining:

$("#box_rtv").trigger("chosen:updated").val('Choose a box...');

(Actually, you probably don't need to call .val() at all.)

If that doesn't work, try deselecting all of your options programatically prior to triggering chosen:updated:

$("#box_rtv > option").prop('selected', false);
$("#box_rtv").trigger("chosen:updated");

Upvotes: 1

Related Questions