Search code examples
javascriptjqueryselectjquery-chosen

Changing selection in a select with the Chosen plugin


I'm trying to change the currently selected option in a select with the Chosen plugin.

The documentation covers updating the list, and triggering an event when an option is selected, but nothing (that I can see) on externally changing the currently selected value.

I have made a jsFiddle to demonstrate the code and my attempted ways of changing the selection:

$('button').click(function() {
    $('select').val(2);
    $('select').chosen().val(2);
    $('select').chosen().select(2);
});

Solution

  • From the "Updating Chosen Dynamically" section in the docs: You need to trigger the 'chosen:updated' event on the field

    $(document).ready(function() {
        
        $('select').chosen();
    
        $('button').click(function() {
            $('select').val(2).change();
            $('select').trigger("chosen:updated");
        });
    
    });
    

    NOTE: versions prior to 1.0 used the following:

    $('select').trigger("liszt:updated");