tablesorter 使用 enter 事件更改自动过滤

Question

我的代码：

  $("#tabelq")
.tablesorter({
    theme: 'blue',
    widthFixed: true,
    sortLocaleCompare: true, // needed for accented characters in the data
    sortList: [ [0,1] ],
    headers: {
        0: { sorter: 'checkbox' }
    },
    widgets: ['zebra', 'filter'],
    widgetOptions : {

        filter_cssFilter   : '',
        filter_childRows   : false,
        filter_hideFilters : false,
        filter_ignoreCase  : true,
        filter_reset : '.reset',
        filter_saveFilters : true,
        filter_searchDelay : 300,
        filter_startsWith  : false,
        filter_hideFilters : false,
    },

})
   .tablesorterPager({
  container: $(".pager"),
  ajaxUrl : '<?php echo Yii::app()->createUrl("Mycontroller/MyAction");?>&page={page}&size={size}&{sortList:col}&{filterList:fcol} ',//{filterList:filter}&{sortList:column}',
  customAjaxUrl: function(table, url) {
      $(table).trigger('changingUrl', url);
      return url;
  },
  ajaxObject: {
    dataType: 'json'
  },
  ajaxProcessing: function(data){
    if (data && data.hasOwnProperty('rows')) {
      var indx, r, row, c, d = data.rows,
      total = data.total_rows,
      headers = data.headers,
      headerXref = headers.join(',').replace(/\s+/g,'').split(','),
      rows = [],
      len = d.length;
      for ( r=0; r < len; r++ ) {
        row = []; // new row array
        for ( c in d[r] ) {
          if (typeof(c) === "string") {
            indx = $.inArray( c, headerXref );
            if (indx >= 0) {
              row[indx] = d[r][c];
            }
          }
        }
        rows.push(row); // add new row array to rows array
      }
      return [ total, rows, headers ];
    }
  },

  output: '{startRow} to {endRow} ({totalRows})',
  updateArrows: true,
  page: 0,
  size: 10,
  fixedHeight: false,
  removeRows: false,
  cssNext        : '.next',  // next page arrow
  cssPrev        : '.prev',  // previous page arrow
  cssFirst       : '.first', // go to first page arrow
  cssLast        : '.last',  // go to last page arrow
  cssPageDisplay : '.pagedisplay', // location of where the "output" is displayed
  cssPageSize    : '.pagesize', // page size selector - select dropdown that sets the "size" option
  cssErrorRow    : 'tablesorter-errorRow', // error information row
  cssDisabled    : 'disabled' // Note there is no period "." in front of this class name

});

它总是向服务器发送 ajax，而且我的数据库查询有点复杂。所以我想使用事件键输入将 ajax 发送到服务器。

另一种尝试是使用 filter_searchDelay : 300,

但还是没有完全解决我的问题。谢谢。

Answer 1

将 filter_liveSearch option 设置为 false...这样做将防止“按类型过滤”行为。

tablesorter 使用 enter 事件更改自动过滤

tablesorter change auto filtering with enter event

ajax

jquery

filtering

tablesorter