Skip to content
Steve James edited this page Mar 13, 2018 · 20 revisions

Hook into any of the events below by either binding to the event name, or passing in the name of the event during initialization:

// bind to event
$("#multiselect").on("multiselectopen", function(event, ui){
    // event handler here
});

// or pass in the handler during initialization
$("#multiselect").multiselect({
    open: function(event, ui){
        // event handler here
    }
});

You can cancel any of the events by returning false in the handler.


beforecheckall

Fires right before all menu options are checked.


beforeclose

Fires right before the menu closes. Prevent the menu from closing by returning false in the handler.


beforecollapseall

Fires right before all option groups are collapsed.


beforecollapsetoggle

Fires right before the collapsed state of a specific option group is toggled.

$("#multiselect").on("multiselectbeforecollapsetoggle", function(event, ui) {
    //Function body
}
  • event The original event object, most likely click.
  • ui.label The label text of the option group being toggled.
  • ui.collapsed A boolean indicating whether the option group is currently collapsed.

beforeexpandall

Fires right before all option groups are expanded.


beforeflipall

Fires right before all menu options are inverted (flipped).


beforeopen

Fires right before the menu opens. Prevent the menu from opening by returning false in the handler.


beforeoptgrouptoggle

Fires right before the check state of options in a specific option group is toggled.

$("#multiselect").on("multiselectbeforeoptgrouptoggle", function(event, ui) {
    //Function body
}
  • event The original event object, most likely click.
  • ui.inputs An array containing all the option inputs (checkboxes).
  • ui.label The label text of the option group being toggled.

beforeuncheckall

Fires right before all menu options are unchecked.


checkall

Fires when all the options are checked by either clicking the "check all" link in the header, or when the "checkall" method is programatically called (see next section).


click

Fires when a checkbox is checked or unchecked.

$("#multiselect").on("multiselectclick", function(event, ui) {
    //Function body
}
  • event The original event object, most likely click.
  • ui.value The value of the checkbox.
  • ui.text The text of the checkbox.
  • ui.checked Whether or not the input was checked or unchecked.

close

Fires after the widget closes.


collapseall

Fired by the collapseAll() method after the collapse operation is completed.


collapsetoggle

Fired by the collapse/expand toggle button.

$("#multiselect").on("multiselectcollapsetoggle", function(event, ui) {
    //Function body
}
  • event The original event object, most likely click.
  • ui.label The label text of the option group being toggled.
  • ui.collapsed A boolean indicating whether the option group is collapsed after the operation completes.

create

Requires jQuery UI Widget Factory 1.8.6+ Fires when the widget is created for the first time.


expandall

Fired by the expandAll() method after the expand operation is completed.


flipall

Triggered when the flipAll() method after the flipAll operation is completed.


maxselected

Triggered when the user has reached the maximum number of selections as specified by the maxSelected option. If a false value is returned no message is displayed for the user, but the new selection is still reverted.

$("#multiselect").on("multiselectcollapsetoggle", function(event, ui) {
    //Function body
}
  • event The original event object, most likely click.
  • ui.labels An array of all option labels.
  • ui.inputs An array of all option inputs, before any new selection is reverted.

open

Fires after the widget opens.


optgrouptoggle

Fires when an optgroup label is clicked on. This event receives the original event object as the first argument, and a hash of values as the second argument.

$("#multiselect").bind("multiselectoptgrouptoggle", function(event, ui){
    //Function body
});
  • event The original event object, most likely click.
  • ui.inputs An array of checkboxes (DOM elements) inside the optgroup.
  • ui.label The text of the optgroup.
  • ui.checked Whether or not the checkboxes were checked or unchecked in the toggle (bool value)

refresh

Triggered when the refresh() method is executed.


resync

Triggered when the resync() method is executed.


uncheckall

Fires when all the options are all unchecked by either clicking the "uncheck all" link in the header, or when the "uncheckall" method is programatically called (see next section).


resize

Triggered when the widget is resized, if the resizableMenu option is enabled. Returning false from the event handler cancels the resize operation.

$("#multiselect").bind("multiselectoptgrouptoggle", function(event, ui){
    //Function body
});
  • event The original event object, most likely click.
  • ui An object containing the dimensions of the menu. Refer to the jQuery UI resizable widget documentation for more details.