Skip to content
yanickrochon edited this page Jul 24, 2012 · 16 revisions

Options

  • collapsibleGroups (boolean) (default: true) : tells whether the option groups can be collapsed or not

      // initialize option
      $(selector).multiselect({ collapsibleGroups: false });
    
      // get option value
      var collapsibleGroups = $(selector).multiselect('option', 'collapsibleGroups');
      // set option after initialization (require refresh)
      $(selector).multiselect('option', 'collapsibleGroups', false).multiselect('refresh');
    
  • locale (string) (default: auto) : any valid locale, auto, or en empty string for default built-in strings if no locale is included. The auto value will try to locate the user's or browser's locale. If the locale is not found, the default build-in strings will be used.

      // initialize option
      $(selector).multiselect({ locale: 'fr' });
    
      // get option value
      var locale = $(selector).multiselect('option', 'locale');
      // set option after initialization (no refresh required)
      $(selector).multiselect('option', 'locale', 'fr');
    
  • moveEffect (string) (default: null) : animate item selection using the specified jQuery UI Effect. Possible values include blind, bounce, clip, drop, explode, fold, highlight, puff, pulsate, shake, and slide.

      // initialize option
      $(selector).multiselect({ moveEffect: 'pulsate' });
    
      // get option value
      var moveEffect = $(selector).multiselect('option', 'moveEffect');
      // set option after initialization (no refresh required)
      $(selector).multiselect('option', 'moveEffect', 'pulsate');
    
  • moveEffectOptions (object) (default: {}) : the effect options value

  • moveEffectSpeed (string|int) (default: null) : string (slow, fast) or number in millisecond (ignored if moveEffect is show)

  • optionRenderer (function) (default: false) : a function that will return the item element to be rendered in the list. The function will receive the <OPTION> element jQuery object and the option group name (if any) and should return a jQuery object of a DOM element.

  • splitRatio (float) (default: 0.55) : % of the left list's width of the widget total width

      // initialize option
      $(selector).multiselect({ collapsibleGroups: false });
    
      // get option value
      var collapsibleGroups = $(selector).multiselect('option', 'collapsibleGroups');
      // set option after initialization (require refresh)
      $(selector).multiselect('option', 'collapsibleGroups', false).multiselect('refresh');
    
  • sortMethod (string|function) (default: standard) : Tells how option items should be sorted. Set null for unsorted (will be displayed as in the original element); 'standard' or 'natural' for the build-in sort functions (sort items as strings); a sort function for custom sort, where the function will receive three arguments and the third being a boolean value indicating if the first two are group (true) or item (false) names, and the returned value should be a numeric value indicating if the first argument is greater (> 0), equal (= 0) or less (< 0) than the second argument.

      // sort option groups asc and items desc
      var _customSort = function(a, b, g) {
          if (a > b) return g ? 1 : -1;
          if (a < b) return g ? -1 : 1;
          return 0;
      };
    
      // initialize option
      $(selector).multiselect({ sortMethod: _customSort });
    
      // get option value
      var sortMethod = $(selector).multiselect('option', 'sortMethod');
      // set option after initialization (require refresh)
      $(selector).multiselect('option', 'sortMethod', _customSort).multiselect('refresh');
    

Methods

  • refresh (argument: function) : refresh the multiselect widget. This method is useful if the SELECT element has been modified externally and changes needs to be applied to the widget. The refresh is done asynchronously and the callback function, if one provided, will be called once the refresh is complete.

      $(selector).multiselect('refresh', function() { /*...*/ });
    
  • search (argument: string|object) : programmatically search the items. The arguments may be a string or an object to specify more options. Unless specified, all searches trigger a multiselectsearch event.

      // search for 'foo'
      $(selector).multiselect('search', 'foo');
      // search for 'foo' but do not trigger events
      $(selector).multiselect('refresh', {text: 'foo', silent:true});
      // search for 'foo' but do not toggle input field if hidden
      $(selector).multiselect('refresh', {text: 'foo', toggleHidden:false});
    
  • locale (argument: string) : set the widget's locale. The expected value is the same as the one in the locale init option. (Note : each multiselect instance may have their own locale.)

      // change the widget's locale to 'french'
      $(selector).multiselect('locale', 'fr');