MS - check item in another MS

1.10

by schittuluri

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/themes/redmond/jquery-ui.css">
<script src="https://cdn.jsdelivr.net/jquery.ui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.multiselect/1.13/jquery.multiselect.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.multiselect/1.13/jquery.multiselect.filter.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-multiselect-widget/1.14/jquery.multiselect.js"></script>
<select id="select_country" multiple>
    <option value="usa">USA</option>
    <option value="can">Canada</option>
</select>

<select id="select_something" multiple>
    <option value="foo">foo</option>
    <option value="bar">bar</option>.
    <option value="baz">baz</option>
</select>

JavaScript

var second = jQuery("#select_something").multiselect();

jQuery("#select_country").multiselect({
    multiple: false,
    header: "Select a country",
    noneSelectedText: "Select a country",
    selectedList: 1,
    click: function( event, ui ) {
        
        // if the user clicks "usa", check the first box
        // in the second select.  if the user selects "canada",
        // check the seoncd box.
        //
        // the call to filter() ensures that the items from the
        // second select remain selected if the user chooses
        // the same item from the first select multiple times.
        //
        // you can easily swap out .eq() for another filter()
        // and to choose checkboxes by value instead of their
        // position.
        second.multiselect('widget')
            .find(':checkbox')
            .eq(ui.value === 'usa'? 0 : 1)
            .filter(':not(:checked)')
            .each(function(){
                this.click();
            });
    }
});