Проблема JQuery TableSorter - PullRequest
Новая
       18

Проблема JQuery TableSorter

16 голосов
/ 19 ноября 2008

У меня возникла пара проблем с плагином JQuery tablesorter . Если щелкнуть заголовок столбца, он должен отсортировать данные по этому столбцу, но есть несколько проблем:

  1. Строки отсортированы неправильно (1, 1, 2183, 236)
  2. Общая строка включена в сортировку

Что касается (2), я не могу легко переместить всю строку в нижний колонтитул таблицы, потому что HTML генерируется библиотекой тегов displaytag , над которой у меня ограниченный контроль.

Что касается (1), я не понимаю, почему сортировка не работает, поскольку я использовал точно такой же JavaScript, показанный в простейшем примере в учебниках по TableSorter .

На самом деле, есть только одна строка кода JS, которая: 

<body onload="jQuery('#communityStats').tablesorter();">

Заранее спасибо, Дон

Ответы [ 6 ]

23 голосов
/ 19 ноября 2008

Первая проблема связана с тем, что сортировщик таблицы автоматически обнаруживает столбец в текстовом столбце (возможно, из-за пустых ячеек). Чтобы решить эту проблему, используйте этот код для инициализации сортировщика таблиц и установите для всех полей либо цифры, либо валюту в зависимости от данных: 

<script type="text/javascript" >
jQuery(document).ready(function() 
{ 
    jQuery("#communityStats").tablesorter({ 
        headers: { 2: { sorter:'digit' } , 
                   3: { sorter:'digit' } ,
                   4: { sorter:'digit' } ,
                   5: { sorter:'digit' } ,
                   6: { sorter:'digit' } ,
                   7: { sorter:'digit' } ,
                   8: { sorter:'currency' } ,
                   9: { sorter:'currency' } ,
                   10: { sorter:'currency' } ,
                   11: { sorter:'currency' } 
                 } 
    }); 
});
</script>
8 голосов
/ 19 ноября 2008

Я бы предложил использовать какой-нибудь Javascript для удаления последней строки из таблицы. Добавьте нижний колонтитул, а затем повторно добавьте удаленную строку из таблицы. Чтобы решить проблему с пустыми данными в числовой ячейке, вам может потребоваться добавить собственный пользовательский анализатор . 

   $(function() {
       $('#communityStats').append("<tfoot></tfoot>");
       $('#communityStats > tr:last').remove()
                                     .appendTo('#communityStats > tfoot');
       $('#communityStats').tablesorter();
   });
2 голосов
/ 19 ноября 2008

I думаю, ответ на вопрос № 1 состоит в том, что у вас есть пустые поля для некоторых числовых столбцов, в результате чего сортировщик таблиц обнаруживает этот столбец как столбец «строка».

0 голосов
/ 17 марта 2010

исправлен заголовок для плагина tableorter:

CSS 

table.tablesorter thead {
position: fixed;
top: 35px; // 
}

JS 

function tableFixedHeader() {
   var tdUnit = $('.tablesorter tbody tr:first').children('td').length;
   for(var i=0;i<tdUnit; i++) {
     $('.tablesorter thead th').eq(i).width($('.tablesorter tbody td').eq(i).width());
   }
   $('.tablesorter').css('margin-top',$('.tablesorter thead').height()); 
}

HTML 

<div id="container">
   <div id="topmenu" style="height:35px;">some buttons</div>
   <div id="tablelist" style="width:100%;overflow:auto;">
      <table class="tablesorterw">.....</table>
   </div>
</div>
0 голосов
/ 19 мая 2009

Я обнаружил, что следующее будет работать с нераспознанными числовыми (цифровыми) столбцами. Похоже, что 0 считается текстом в текущей версии (2.0.3) TableSorter.

Включая пример из tvanfosson, этот скрипт внизу вашей страницы переместит вашу последнюю строку из нижнего колонтитула, что предотвратит ее сортировку с данными в tbody и заставит сортировщик использовать числовую сортировку, а не текст сортируйте его, как вы описали. 

$(document).ready(function() {
  $('#communityStats').append("<tfoot></tfoot>");
  $('#communityStats > tr:last').remove()
    .appendTo('#communityStats > tfoot');

  $("#communityStats").tablesorter({
     debug: true,
     headers: { 
       0:{sorter: 'digit'}
       ...
       10:{sorter: 'digit'}
     }
  });

});
0 голосов
/ 19 ноября 2008

  1. Могут возникнуть проблемы с пустыми полями (например, они не равны 0), попробуйте использовать собственный синтаксический анализатор, который удаляет все нечисловые значения и переводит значения в целые числа (например: http://paste.pocoo.org/show/90863/)

  2. Поместите строку «Всего» внутри тега

...