Reputation: 1751
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
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
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
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