yii2 Grid Filter - Ignore Filter Input Change

Question

I'm adding a range filter in yii2 gridView which when you click on the filter input, shows a popover like the one shown.

The div for the popover is inside the td filter cell (position:absolute).

When I change the I change the 'from' or 'to' value, it triggers the grid to reload and filter from yii.gridView.js. How can I avoid the grid filtering when I change these input values? Ie. stop the 'applyFilter' function from yii.gridView.js running?

The listener appears to be on inputs located within the filter row.

friek108 friek108 · Accepted Answer · 2016-11-23T02:40:32

I ended up having to bind a new click and 'enter press' listener to the 'from' and 'to' filter inputs, and then use the bindFirst to bind it before the yii.gridView.js and return false to stop it propagating. Like so:

/**
 * Need to bind first to stop yii.gridView.js triggering filter change   
 */
$filterInputs.bindFirst('change.yiiGridView keydown.yiiGridView', function() { 
    if (event.type === 'keydown') {
        // enter button
        if (event.keyCode == 13) {
            $btn.trigger('click');
            return false;
        }
    } else return false;
});

/**
 * Bind to the front of the event listener queue
 */
$.fn.bindFirst = function(name, fn) {
  var elem, handlers, i, _len;
  this.bind(name, fn);
  for (i = 0, _len = this.length; i < _len; i++) {
    elem = this[i];
    handlers = jQuery._data(elem).events[name.split('.')[0]];
    handlers.unshift(handlers.pop());
  }
};

yii2 Grid Filter - Ignore Filter Input Change

1 Answers