Chosen: .trigger("chosen:updated") does not right to selected the option that i give

sorry for my poor's english :sob:

If I understand correctly, you add new options to the select using an ajax request, and then you trigger chosen:updated to make Chosen reflect the changes?

Please set up a fiddle to demonstrate the problen, and then we can decide if it's a bug or just an issue with your implementation.

THANKS FOR REP this

NOT LIKE THAT .. not refresh the option list
the option list is all the way same
but the value not so
every time i wanna change the value i trigger chosen:updated via jQuery
when i first time the value of the selected items was right
but will go wrong when serivel times later
i can't get the right value of the select elment....


when firsttime load the function was right just one option need to be selected

then once again

it should be like this

https://jsfiddle.net/4jtsdnt7/ someof

Hi blankhang,
your problem can be solved by this.
what you are doing:
$("#one option[value=1]').attr('selected', true);
$("#one option[value=3]').attr('selected', true);
$("#one").val(1).trigger("chosen:updated");

what need to be done

$("#one option[value=1]').attr('selected', true);
$("#one option[value=3]').attr('selected', true);
$("#one").trigger("chosen:updated");

dont give any value while trigger the update;

I experienced the same issue after updating the select state of the options of a multiple select by JS, then trying to update Chosen to show the selection. I've made a fiddle that demonstrates this behavior:

https://jsfiddle.net/5wbzxg27/

There are 3 buttons:

• select all options,
• select some of the options,
• select the remaining options.

Each option shows up only once in the Chosen box, even if you press the same button (and updating it) several times. The script runs okay, the selected state of the original select options changes okay, but the Chosen shows the options only the first time.

Hope, this helps.

@cinemazealot try following code:

$("#mySelect").chosen({
       placeholder_text_multiple: 'Something',
});
$('button#all').on('click', function() {
  $('#mySelect option').attr('selected', false);   // selects all
  var options = [];
  for (var i=0; i < $('#mySelect option').length; i++){
    options.push($('#mySelect option')[i].value);
  };
  $('#mySelect').val(options);
  $("#mySelect").trigger("chosen:updated");       // updates chosen
  return false;                                   // returns false not to post the surrounding form
});
$('button#first').on('click', function() {
  $('#mySelect option').attr('selected', false);  // clears all
  var options = [];
  for (var i=0; i < $('#mySelect optgroup[label="first"] option').length; i++){
    options.push($('#mySelect optgroup[label="first"] option')[i].value);
  };
  $('#mySelect').val(options);
  $("#mySelect").trigger("chosen:updated");       // updates chosen
  return false;                                   // returns false not to post the surrounding form
});
$('button#second').on('click', function() {
  $('#mySelect option').attr('selected', false);  // clears all
    var options = [];
  for (var i=0; i < $('#mySelect optgroup[label="second"] option').length; i++){
    options.push($('#mySelect optgroup[label="second"] option')[i].value);
  };
  $('#mySelect').val(options);
  $("#mySelect").trigger("chosen:updated");       // updates chosen
  return false;                                   // returns false not to post the surrounding form
});

It might look clunky and big, but it seem to work

@pashaUSA you are the best! :) Sorry for the late reaction, I had other running projects. But your solution just does that it supposed to do. Thanks a lot! :)