Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 11 additions & 39 deletions src/jquery.multiselect.filter.js
Original file line number Diff line number Diff line change
Expand Up @@ -71,11 +71,11 @@
else if(e.which === 27) {
$element.multiselect('close');
e.preventDefault();
}
}
else if(e.which === 9 && e.shiftKey) {
$element.multiselect('close');
e.preventDefault();
}
}
else if(e.altKey) {
switch(e.which) {
case 82:
Expand All @@ -100,7 +100,7 @@
// automatically reset the widget on close?
if (this.options.autoReset)
$element.on('multiselectclose', $.proxy(this._reset, this));

// rebuild cache when multiselect is updated
$element.on('multiselectrefresh', $.proxy(function() {
this.updateCache();
Expand All @@ -113,47 +113,19 @@
.prependTo(this.$header);

// reference to the actual inputs
this.$inputs = this.instance.$menu.find('input[type="checkbox"], input[type="radio"]');
this.$inputs = this.instance.$inputs;

// cache input values for searching
this.updateCache();

// rewrite internal _toggleChecked fn so that when checkAll/uncheckAll is fired,
// only the currently filtered $elements are checked
this.instance._toggleChecked = function(flag, group) {
var self = this;
var $element = this.element;
var $inputs = (group && group.length) ? group : this.$inputs;

// do not include hidden elems if the menu isn't open.
var selector = self._isOpen ? ':disabled, :hidden' : ':disabled';

$inputs = $inputs
.not(selector)
.each(this._toggleState('checked', flag));

// update text
this.update();

// gather an array of the values that actually changed
var values = {};
var inputCount = $inputs.length;
for (var x = 0; x < inputCount; x++) {
values[ $inputs.get(x).value ] = true;
}

// select option tags
$element.find('option').filter(function() {
if(!this.disabled && values[this.value]) {
self._toggleState('selected', flag).call(this);
}
});

// trigger the change event on the select
if(inputCount)
$element.trigger('change');

// Change the normal _toggleChecked fxn behavior so that when checkAll/uncheckAll
// is fired, only the currently displayed filtered inputs are checked
var $instance = this.instance;
$instance._oldToggleChecked = $instance._toggleChecked;
$instance._toggleChecked = function(flag, group) {
$instance._oldToggleChecked(flag, group, true);
};

},

// thx for the logic here ben alman
Expand Down
33 changes: 20 additions & 13 deletions src/jquery.multiselect.js
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@
* 3. If still do not have a valid DOM element to append to, then append to the document body.
*
* NOTE: this.element and this.document are jQuery objects per the jQuery UI widget API.
* @returns {object} jQuery object to append to or document body.
* @returns {object} jQuery object for the DOM element to append to.
*/
_getAppendEl: function() {
var elem = this.options.appendTo; // jQuery object or selector, DOM element or null.
Expand All @@ -80,7 +80,7 @@
elem = this.element.closest(".ui-front, dialog");
}
if (!elem.length) {
elem = document.body; // Position at end of body. Note that this returns a DOM element.
elem = $(document.body); // Position at end of body. Note that this returns a DOM element.
}
return elem;
},
Expand Down Expand Up @@ -169,16 +169,15 @@
var $checkboxes = (this.$checkboxes = $( document.createElement('ul') ) )
.addClass('ui-multiselect-checkboxes ui-helper-reset' + (/\bmenu\b/i.test(wrapText) ? '' : ' ui-multiselect-nowrap'));

// This is the menu that will hold all the options.
// This is the menu container that will hold all the options added via refresh().
var $menu = (this.$menu = $( document.createElement('div') ) )
.addClass('ui-multiselect-menu ui-widget ui-widget-content ui-corner-all'
+ (elSelect.multiple ? '' : ' ui-multiselect-single ')
+ (classes ? ' ' + classes : ''))
.append($header, $checkboxes);

$button.insertAfter($element);
// This is an empty menu at this point.
$menu.appendTo( this._getAppendEl() );
this._getAppendEl().append($menu);

this._bindEvents();

Expand Down Expand Up @@ -731,7 +730,7 @@
/**
* Converts dimensions specified in options to pixel values.
* Determines if specified value is a minimum, maximum or exact value.
* The value can be a number or a string with px, pts, ems, or % units.
* The value can be a number or a string with px, pts, ems, in, cm, mm, or % units.
* Number/Numeric string treated as pixel measurements
* - 30
* - '30'
Expand Down Expand Up @@ -936,7 +935,7 @@
/**
* Calculate accurate outerWidth(false) using getBoundingClientRect()
* Note that this presumes that the element is visible in the layout.
* @param {node} DOM node or jQuery equivalent get width for.
* @param {node} DOM node or jQuery equivalent to get width for.
* @returns {float} Decimal floating point value for the width.
*/
_getBCRWidth: function(elem) {
Expand All @@ -950,7 +949,7 @@
/**
* Calculate accurate outerHeight(false) using getBoundingClientRect()
* Note that this presumes that the element is visible in the layout.
* @param {node} DOM node or jQuery equivalent get height for.
* @param {node} DOM node or jQuery equivalent to get height for.
* @returns {float} Decimal floating point value for the height.
*/
_getBCRHeight: function(elem) {
Expand All @@ -964,7 +963,7 @@
/**
* Calculate jQuery width correction factor to fix floating point round-off errors.
* Note that this presumes that the element is visible in the layout.
* @param {node} DOM node or jQuery equivalent get width for.
* @param {node} DOM node or jQuery equivalent to get width for.
* @returns {float} Correction value for the width--typically a decimal < 1.0
*/
_jqWidthFix: function(elem) {
Expand All @@ -979,7 +978,7 @@
/**
* Calculate jQuery height correction factor to fix floating point round-off errors.
* Note that this presumes that the element is visible in the layout.
* @param {node} DOM node or jQuery equivalent get height for.
* @param {node} DOM node or jQuery equivalent to get height for.
* @returns {float} Correction value for the height--typically a decimal < 1.0
*/
_jqHeightFix: function(elem) {
Expand Down Expand Up @@ -1090,12 +1089,21 @@
* Potentially scoped down to visible elements from filteredInputs
* @param {string} flag checked property to set
* @param {object} group option group that was clicked, if any
* @param {array} filteredInputs visible elements with the filter applied
* @param {boolean} filteredInputs does not toggle hidden inputs if filtering.
*/
_toggleChecked: function(flag, group, filteredInputs) {
var self = this;
var $element = self.element;
var $inputs = (group && group.length) ? group : (filteredInputs || self.$inputs);
var $inputs = (group && group.length) ? group : self.$inputs;

if (filteredInputs) {
// Do not include hidden inputs if the menu isn't open.
$inputs = $inputs.not( self._isOpen ? ':disabled, :hidden' : ':disabled' );
}
else {
// If not filtering, then the underlying select is cleared out each time.
$element[0].selectedIndex = -1;
}

// toggle state on inputs
$inputs.each(self._toggleState('checked', flag));
Expand All @@ -1113,7 +1121,6 @@
});

// toggle state on original option tags
$element[0].selectedIndex = -1;
$element.find('option')
.each( function() {
if (!this.disabled && values[this.value]) {
Expand Down
Loading