jQuery tablesorter - rowspan в заголовках вызывает странное поведение - PullRequest
Новая
       5

jQuery tablesorter - rowspan в заголовках вызывает странное поведение

4 голосов
/ 24 июля 2010

Пример сбоя:
http://progamonth.com/files/testfile.html

Желаемое поведение:
В идеале любые заголовки с colspan не должны влиять на сортировку. Прямо сейчас они получают кнопки сортировки, и даже если я укажу headers: {index: {sorter: false}} для каждого из заголовков colspan, они все равно влияют на сортировку. Когда я щелкаю заголовки без разброса строк или colspan (1.1.2 и т. Д.), Кажется, что они вызывают сортировку на 4 столбца справа!

Пример этой работы, которую я не могу воспроизвести:
http://lovepeacenukes.com/tablesorter/2.0/docs/

Кажется, эта страница показывает, как это работает, но я просто не могу воспроизвести это. Пример для rowspan даже не отключает эти заголовки вручную, так что же происходит ?! Я вижу, что заголовки colspan в этом примере не имеют класса header, но это, похоже, применяется плагином TableSorter.

Кто-нибудь знает, что происходит?

Рабочая картинка: альтернативный текст http://progamonth.com/files/working.png

Не работает картинка: альтернативный текст http://progamonth.com/files/notworking.png

Ответы [ 4 ]

3 голосов
/ 27 июля 2010

В демоверсии документов используются другие (древние) версии jQuery и Tablesorter, чем вы. Из сравнения источников я вижу, что автоматическое определение диапазона столбцов / строк никогда не выполняется в более новой версии. Функция обнаружения промежутков все еще там - но просто не вызывается. Не знаю, почему произошла эта регрессия.

Как говорится, я могу запустить ваше демо, используя эту настройку: 

$(document).ready(function(){
  $('#rowspan').tablesorter({
    headers: {
      4: {sorter: false},
      5: {sorter: false},
      6: {sorter: false},
      7: {sorter: false}
    } 
  });
});

Что, если вы знаете, что colspan>1 является безопасным критерием, то я бы вывел индексы заголовков следующим образом: 

$(function(){
  var headers = {};
  $('#rowspan thead th').each(function(i,h){
    if (this.colSpan>1) { headers[i] = { sorter: false }; }
  });
  $('#rowspan').tablesorter({
    headers: headers
  });
});

Обновление:

«Рабочий» пример: http://jsbin.com/ucija3

Пример выглядит так, как вы просили, или я не понимаю ваш вопрос. Однако я только что обнаружил, что нажатие на заголовки с меткой 3.1 - 4.2 вызывает исключения. Итак, я думаю, мой окончательный ответ на ваш вопрос: Текущая версия этого плагина не работает со строками или кольспанами.

Обновление:

Простой патч, чтобы сделать эту работу:

В функции buildHeaders (строка 290) измените строку $tableHeaders = $("thead th",table); на: 

$tableHeaders = $("thead th:not([colspan]),thead th[colspan=1]",table);

Более сложный гибкий патч:

Добавить параметр конфигурации в buildHeaders (строка 290): 

function buildHeaders(table, config) {  # ...

И фильтр до $tableHeaders (строка 299): 

$tableHeaders = $("thead th",table).filter( config.headerFilter || '*' );

Передайте конфигурацию buildHeaders, когда она вызывается (строка 504): 

$headers = buildHeaders(this, config);

Добавить фильтр при инициализации сортировщика таблиц: 

$(function(){
  $('#rowspan').tablesorter({
    headerFilter: function(){ return this.colSpan == 1; }
  });
});

Вот предварительно исправленная версия , которая включает в себя опцию headerFilter и ее демонстрацию в действии.

2 голосов
/ 30 июля 2010

Эта функция была отключена, как сказано здесь: текст ссылки

Я нашел другой способ получить тот же эффект, внутри js таблицы в строке 298 есть это правило кода: 

$tableHeaders = $("thead th",table);

Измените его на 

$tableHeaders = $("thead th:not([colspan])",table);

, и это работает для меня!

РЕДАКТИРОВАТЬ: Изменен код и местоположение

1 голос
/ 05 февраля 2011

FYI, исправление предоставлено red-X:

$ tableHeaders = $ ("thead th", таблица);Измените его на

$ tableHeaders = $ ("thead th: not ([colspan])", таблица);

разрывает плагин tableorter для IE6 и IE7.Единственное решение, которое я придумал (которое я нашел в другом месте), это то, что вам нужна только одна строка и одна строка, содержащая теги TH.В вашей THEAD могут быть другие столбцы (включая столбцы с colspans), но они должны использовать тег TD.Это не идеально с точки зрения разметки, но, по крайней мере, плагин работает на IE6 и IE7.

0 голосов
/ 27 июля 2010

Я не полностью проверил это, но я бы предложил обновить тип вашего документа. По опыту сортировщик таблиц (и jQuery в целом) может быть весьма чувствительным к типам документов.

Демонстрация (которая работает) использует следующее: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Редактировать: После обновления DocType он все еще не работал для меня. Затем я скачал версию TableSorter, используемую на демо-сайте, и теперь она работает как demo'd. Единственное другое отличие состоит в том, что я включил скрипты и CSS в раздел заголовка документа, но это не должно иметь никакого значения.

Я действительно думал, что версия jQuery может быть проблемой, но я использую 1.3.2, используя тот же ресурс, что и вы.

...