Filter: Add namespacing to filter-formatter listeners

Needed to prevent JS error when a "resetToLoadState" is triggered
and the "filterFomatterUpdate" bindings are still firing.
This commit is contained in:
Rob Garrison 2017-06-29 22:21:32 -05:00
parent 5b852eae78
commit 2668e0e773
3 changed files with 83 additions and 72 deletions

View File

@ -89,18 +89,20 @@
chkd = $cell.find('.toggle').is(':checked'); chkd = $cell.find('.toggle').is(':checked');
} }
state = o.disabled || !chkd ? 'disable' : 'enable'; state = o.disabled || !chkd ? 'disable' : 'enable';
$cell.find('.filter') if (!ts.isEmptyObject($cell.find('.spinner').data())) {
// add equal to the beginning, so we filter exact numbers $cell.find('.filter')
.val( chkd ? (compare ? compare : o.exactMatch ? '=' : '') + v : '' ) // add equal to the beginning, so we filter exact numbers
.trigger( notrigger ? '' : 'search', searchType ).end() .val( chkd ? (compare ? compare : o.exactMatch ? '=' : '') + v : '' )
.find('.spinner').spinner(state).val(v); .trigger( notrigger ? '' : 'search', searchType ).end()
// update sticky header cell .find('.spinner').spinner(state).val(v);
if ($shcell.length) { // update sticky header cell
$shcell if ($shcell.length) {
.find('.spinner').spinner(state).val(v).end() $shcell
.find(compareSelect).val( compare ); .find('.spinner').spinner(state).val(v).end()
if (o.addToggle) { .find(compareSelect).val( compare );
$shcell.find('.toggle')[0].checked = chkd; if (o.addToggle) {
$shcell.find('.toggle')[0].checked = chkd;
}
} }
} }
}; };
@ -137,7 +139,7 @@
}); });
// update spinner from hidden input, in case of saved filters // update spinner from hidden input, in case of saved filters
c.$table.bind('filterFomatterUpdate', function(){ c.$table.bind('filterFomatterUpdate' + c.namespace + 'filter', function(){
var val = tsff.updateCompare($cell, $input, o)[0]; var val = tsff.updateCompare($cell, $input, o)[0];
$cell.find('.spinner').val( val ); $cell.find('.spinner').val( val );
updateSpinner({ value: val }, true); updateSpinner({ value: val }, true);
@ -153,7 +155,7 @@
} }
// has sticky headers? // has sticky headers?
c.$table.bind('stickyHeadersInit', function(){ c.$table.bind('stickyHeadersInit' + c.namespace + 'filter', function(){
$shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty(); $shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty();
if (o.addToggle) { if (o.addToggle) {
$('<div class="button"><input id="stickyuispinnerbutton' + indx + '" type="checkbox" class="toggle" />' + $('<div class="button"><input id="stickyuispinnerbutton' + indx + '" type="checkbox" class="toggle" />' +
@ -187,7 +189,7 @@
}); });
// on reset // on reset
c.$table.bind('filterReset', function(){ c.$table.bind('filterReset' + c.namespace + 'filter', function(){
if ($.isArray(o.compare)) { if ($.isArray(o.compare)) {
$cell.add($shcell).find(compareSelect).val( o.compare[ o.selected || 0 ] ); $cell.add($shcell).find(compareSelect).val( o.compare[ o.selected || 0 ] );
} }
@ -250,24 +252,26 @@
// add values to the handle data-value attribute so the css tooltip will work properly // add values to the handle data-value attribute so the css tooltip will work properly
$cell.find('.ui-slider-handle').addClass('value-popup').attr('data-value', result); $cell.find('.ui-slider-handle').addClass('value-popup').attr('data-value', result);
} }
// update the hidden input; // prevent JS error if "resetToLoadState" or filter widget was removed for another reason
// ****** ADD AN EQUAL SIGN TO THE BEGINNING! <- this makes the slide exactly match the number ****** if (!ts.isEmptyObject($cell.find('.slider').data())) {
// when the value is at the minimum, clear the hidden input so all rows will be seen // update the hidden input;
$cell.find('.filter')
$cell.find('.filter') // ****** ADD AN EQUAL SIGN TO THE BEGINNING! <- this makes the slide exactly match the number ******
.val( ( compare ? compare + v : v === o.min ? '' : (o.exactMatch ? '=' : '') + v ) ) // when the value is at the minimum, clear the hidden input so all rows will be seen
.trigger( notrigger ? '' : 'search', searchType ).end() .val( ( compare ? compare + v : v === o.min ? '' : (o.exactMatch ? '=' : '') + v ) )
.find('.slider').slider('value', v); .trigger( notrigger ? '' : 'search', searchType ).end()
// update sticky header cell
if ($shcell.length) {
$shcell
.find(compareSelect).val( compare ).end()
.find('.slider').slider('value', v); .find('.slider').slider('value', v);
if (o.valueToHeader) {
$shcell.closest('thead').find('th[data-column=' + indx + ']').find('.curvalue').html(' (' + result + ')'); // update sticky header cell
} else { if ($shcell.length) {
$shcell.find('.ui-slider-handle').addClass('value-popup').attr('data-value', result); $shcell
.find(compareSelect).val( compare ).end()
.find('.slider').slider('value', v);
if (o.valueToHeader) {
$shcell.closest('thead').find('th[data-column=' + indx + ']').find('.curvalue').html(' (' + result + ')');
} else {
$shcell.find('.ui-slider-handle').addClass('value-popup').attr('data-value', result);
}
} }
} }
@ -296,7 +300,7 @@
.slider(o); .slider(o);
// update slider from hidden input, in case of saved filters // update slider from hidden input, in case of saved filters
c.$table.bind('filterFomatterUpdate', function(){ c.$table.bind('filterFomatterUpdate' + c.namespace + 'filter', function(){
var val = tsff.updateCompare($cell, $input, o)[0]; var val = tsff.updateCompare($cell, $input, o)[0];
$cell.find('.slider').slider('value', val ); $cell.find('.slider').slider('value', val );
updateSlider({ value: val }, false); updateSlider({ value: val }, false);
@ -312,7 +316,7 @@
} }
// on reset // on reset
c.$table.bind('filterReset', function(){ c.$table.bind('filterReset' + c.namespace + 'filter', function(){
if ($.isArray(o.compare)) { if ($.isArray(o.compare)) {
$cell.add($shcell).find(compareSelect).val( o.compare[ o.selected || 0 ] ); $cell.add($shcell).find(compareSelect).val( o.compare[ o.selected || 0 ] );
} }
@ -322,7 +326,7 @@
}); });
// has sticky headers? // has sticky headers?
c.$table.bind('stickyHeadersInit', function(){ c.$table.bind('stickyHeadersInit' + c.namespace + 'filter', function(){
$shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty(); $shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty();
// add a jQuery UI slider! // add a jQuery UI slider!
@ -401,20 +405,22 @@
.eq(0).attr('data-value', val[0]).end() // adding value to data attribute .eq(0).attr('data-value', val[0]).end() // adding value to data attribute
.eq(1).attr('data-value', val[1]); // value popup shown via css .eq(1).attr('data-value', val[1]); // value popup shown via css
} }
// update the hidden input if (!ts.isEmptyObject($cell.find('.range').data())) {
$cell.find('.filter').val(range) // update the hidden input
.trigger(notrigger ? '' : 'search', searchType).end() $cell.find('.filter').val(range)
.find('.range').slider('values', val); .trigger(notrigger ? '' : 'search', searchType).end()
// update sticky header cell .find('.range').slider('values', val);
if ($shcell.length) { // update sticky header cell
$shcell.find('.range').slider('values', val); if ($shcell.length) {
if (o.valueToHeader) { $shcell.find('.range').slider('values', val);
$shcell.closest('thead').find('th[data-column=' + indx + ']').find('.currange').html(' (' + result + ')'); if (o.valueToHeader) {
} else { $shcell.closest('thead').find('th[data-column=' + indx + ']').find('.currange').html(' (' + result + ')');
$shcell.find('.ui-slider-handle') } else {
.addClass('value-popup') $shcell.find('.ui-slider-handle')
.eq(0).attr('data-value', val[0]).end() // adding value to data attribute .addClass('value-popup')
.eq(1).attr('data-value', val[1]); // value popup shown via css .eq(0).attr('data-value', val[0]).end() // adding value to data attribute
.eq(1).attr('data-value', val[1]); // value popup shown via css
}
} }
} }
@ -443,13 +449,13 @@
.slider(o); .slider(o);
// update slider from hidden input, in case of saved filters // update slider from hidden input, in case of saved filters
c.$table.bind('filterFomatterUpdate', function(){ c.$table.bind('filterFomatterUpdate' + c.namespace + 'filter', function(){
getRange(); getRange();
ts.filter.formatterUpdated($cell, indx); ts.filter.formatterUpdated($cell, indx);
}); });
// on reset // on reset
c.$table.bind('filterReset', function(){ c.$table.bind('filterReset' + c.namespace + 'filter', function(){
$cell.find('.range').slider('values', o.values); $cell.find('.range').slider('values', o.values);
setTimeout(function(){ setTimeout(function(){
updateUiRange(); updateUiRange();
@ -457,7 +463,7 @@
}); });
// has sticky headers? // has sticky headers?
c.$table.bind('stickyHeadersInit', function(){ c.$table.bind('stickyHeadersInit' + c.namespace + 'filter', function(){
$shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty(); $shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty();
// add a jQuery UI slider! // add a jQuery UI slider!
@ -552,7 +558,7 @@
$date.datepicker(o); $date.datepicker(o);
// on reset // on reset
c.$table.bind('filterReset', function(){ c.$table.bind('filterReset' + c.namespace + 'filter', function(){
if ($.isArray(o.compare)) { if ($.isArray(o.compare)) {
$cell.add($shcell).find(compareSelect).val( o.compare[ o.selected || 0 ] ); $cell.add($shcell).find(compareSelect).val( o.compare[ o.selected || 0 ] );
} }
@ -563,7 +569,7 @@
}); });
// update date compare from hidden input, in case of saved filters // update date compare from hidden input, in case of saved filters
c.$table.bind('filterFomatterUpdate', function(){ c.$table.bind('filterFomatterUpdate' + c.namespace + 'filter', function(){
var num, v = $input.val(); var num, v = $input.val();
if (/\s+-\s+/.test(v)) { if (/\s+-\s+/.test(v)) {
// date range found; assume an exact match on one day // date range found; assume an exact match on one day
@ -591,7 +597,7 @@
} }
// has sticky headers? // has sticky headers?
c.$table.bind('stickyHeadersInit', function(){ c.$table.bind('stickyHeadersInit' + c.namespace + 'filter', function(){
$shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty(); $shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty();
// add a jQuery datepicker! // add a jQuery datepicker!
@ -702,7 +708,7 @@
$cell.find('.dateTo').datepicker(o); $cell.find('.dateTo').datepicker(o);
// update date compare from hidden input, in case of saved filters // update date compare from hidden input, in case of saved filters
c.$table.bind('filterFomatterUpdate', function(){ c.$table.bind('filterFomatterUpdate' + c.namespace + 'filter', function(){
var val = $input.val() || '', var val = $input.val() || '',
from = '', from = '',
to = ''; to = '';
@ -733,7 +739,7 @@
}); });
// has sticky headers? // has sticky headers?
c.$table.bind('stickyHeadersInit', function(){ c.$table.bind('stickyHeadersInit' + c.namespace + 'filter', function(){
$shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty(); $shcell = c.widgetOptions.$sticky.find('.tablesorter-filter-row').children().eq(indx).empty();
$shcell.append(t); $shcell.append(t);
@ -747,7 +753,7 @@
}); });
// on reset // on reset
$cell.closest('table').bind('filterReset', function(){ $cell.closest('table').bind('filterReset' + c.namespace + 'filter', function(){
$cell.add($shcell).find('.dateFrom').val('').datepicker('setDate', o.from || null ); $cell.add($shcell).find('.dateFrom').val('').datepicker('setDate', o.from || null );
$cell.add($shcell).find('.dateTo').val('').datepicker('setDate', o.to || null ); $cell.add($shcell).find('.dateTo').val('').datepicker('setDate', o.to || null );
setTimeout(function(){ setTimeout(function(){

View File

@ -70,18 +70,20 @@
if (arry) { if (arry) {
v = v.split('\u0000'); v = v.split('\u0000');
} }
$input if (!ts.isEmptyObject($input.find('.select2').data())) {
// add regex, so we filter exact numbers $input
.val( // add regex, so we filter exact numbers
$.isArray(v) && v.length && v.join('') !== '' ? .val(
'/(' + matchPrefix + (v || []).join(matchSuffix + '|' + matchPrefix) + matchSuffix + ')/' + flags : $.isArray(v) && v.length && v.join('') !== '' ?
'' '/(' + matchPrefix + (v || []).join(matchSuffix + '|' + matchPrefix) + matchSuffix + ')/' + flags :
) ''
.trigger('search').end() )
.find('.select2').select2('val', v); .trigger('search').end()
// update sticky header cell .find('.select2').select2('val', v);
if (c.widgetOptions.$sticky) { // update sticky header cell
c.widgetOptions.$sticky.find('.select2col' + indx + ' .select2').select2('val', v); if (c.widgetOptions.$sticky) {
c.widgetOptions.$sticky.find('.select2col' + indx + ' .select2').select2('val', v);
}
} }
}, },

View File

@ -69,7 +69,8 @@
var tbodyIndex, $tbody, var tbodyIndex, $tbody,
$table = c.$table, $table = c.$table,
$tbodies = c.$tbodies, $tbodies = c.$tbodies,
events = 'addRows updateCell update updateRows updateComplete appendCache filterReset filterAndSortReset filterEnd search ' events = 'addRows updateCell update updateRows updateComplete appendCache filterReset ' +
'filterAndSortReset filterFomatterUpdate filterEnd search stickyHeadersInit '
.split( ' ' ).join( c.namespace + 'filter ' ); .split( ' ' ).join( c.namespace + 'filter ' );
$table $table
.removeClass( 'hasFilters' ) .removeClass( 'hasFilters' )
@ -599,7 +600,9 @@
// so we have to work with it instead // so we have to work with it instead
formatterUpdated: function( $cell, column ) { formatterUpdated: function( $cell, column ) {
// prevent error if $cell is undefined - see #1056 // prevent error if $cell is undefined - see #1056
var wo = $cell && $cell.closest( 'table' )[0].config.widgetOptions; var $table = $cell && $cell.closest( 'table' );
var config = $table.length && $table[0].config,
wo = config && config.widgetOptions;
if ( wo && !wo.filter_initialized ) { if ( wo && !wo.filter_initialized ) {
// add updates by column since this function // add updates by column since this function
// may be called numerous times before initialization // may be called numerous times before initialization