Jquery TableSorter 2.0小部件(多列过滤)插件

时间:2012-08-30 14:18:46

标签: jquery tablesorter

我想为输入实现datepicker。问题是输入是在tablesorter插件中创建的,我不知道该怎么做。

http://mottie.github.com/tablesorter/docs/example-widget-filter-custom.html 在这里你可以找到插件的代码: https://github.com/Mottie/tablesorter/blob/master/js/jquery.tablesorter.widgets.js

1 个答案:

答案 0 :(得分:0)

在2.7.7版本中,一个名为filter_formatter的新选项被添加到tablesorter过滤器小部件中。您现在可以使用此选项添加jQuery UI datepicker范围来过滤表内容。

您需要包含一个名为“jquery.tablesorter.widgets-filter-formatter.js”的新文件,并添加下面显示的代码以添加它。这是demo的工作原理。

$(function() {

  // call the tablesorter plugin
  $("table").tablesorter({
    theme: 'blue',
    // hidden filter input/selects will resize the columns, so try to minimize the change
    widthFixed : true,
    // initialize zebra striping and filter widgets
    widgets: ["zebra", "filter"],
    widgetOptions : {
      // jQuery selector string of an element used to reset the filters
      filter_reset : 'button.reset',
      // add custom selector elements to the filter row
      filter_formatter : {

        6 : function($cell, indx){
          return $.tablesorter.filterFormatter.uiDatepicker( $cell, indx, {
            from : '12/1/2012', // default from date
            to   : '2/1/2014',  // default to date
            changeMonth: true,
            changeYear : true
          });
        }

      }
    }
  });

});