jquery - Jquery TableSorter 2.0 小部件（多列过滤）插件

Question

我想为输入实现 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

Answer 1

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

您需要包含一个名为“jquery.tablesorter.widgets-filter-formatter.js”的新文件，并添加如下所示的代码来添加它。这是它工作的演示。

$(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
          });
        }

      }
    }
  });

});