Фильтр перестает работать при добавлении виджета скроллера

Question

У меня есть таблица с фильтрами, в которых я использую tablesorter и filter formatter. Я хочу добавить полосу прокрутки в таблицу, но когда я добавлю widget-scroller.js, она перестает работать.

Заголовок:

<script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/cupertino/jquery-ui.css"> 
    <script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="https://bowercdn.net/c/jquery.tablesorter-2.7.8/css/theme.blue.css"> 
    <link rel="stylesheet" type="text/css" href="https://bowercdn.net/c/jquery.tablesorter-2.7.8/css/filter.formatter.css"> 
    <script type='text/javascript' src="https://bowercdn.net/c/jquery.tablesorter-2.7.8/js/jquery.tablesorter.js"></script> 
    <script type='text/javascript' src="https://bowercdn.net/c/jquery.tablesorter-2.7.8/js/jquery.tablesorter.widgets.js"></script> 
    <script type='text/javascript' src="https://bowercdn.net/c/jquery.tablesorter-2.7.8/js/jquery.tablesorter.widgets-filter-formatter.js"></script> 
    <script type='text/javascript' src="https://mottie.github.io/tablesorter/js/widgets/widget-scroller.js"></script> 

Javascript

$(".tablesorter").tablesorter({ 
    theme: 'blue', 
    widthFixed : true, 
    widgets: ['zebra', 'scroller', 'filter'], 
    widgetOptions: { 
     filter_formatter : { 
      1 : 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 
       }); 
      } 
     } 
    } 

}); 

Here is a demo
Если вы удалите виджет scroller.js из демки, он начнет работать.
Полоса прокрутки работала до того, как был добавлен фильтр.

Может ли кто-нибудь сказать мне, что я делаю неправильно?

Answer 1

Похоже, что проблема заключается в версии tablesorter. Скроллер виджет требует TableSorter v2.8 +, но это всегда лучше использовать самую последнюю версию (demo, cdn)

$(function(){ 
    $(".tablesorter").tablesorter({ 
    theme: 'blue', 
    widthFixed : true, 
    widgets: ['zebra', 'scroller', 'filter'], 
    widgetOptions: { 

     // add custom selector elements to the filter row 
     /* 
     filter_formatter : { 

     // Date (two inputs) 
     1 : 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 
      }); 
     } 
     } 
     */ 
    } 
    }); 

}); 

К сожалению, скроллер виджет прогресса работы-в-и не поддерживает фильтр настройки форматирования - так что jQuery UI datepicker в настоящее время не работает в этой демонстрации.