TableSorter (jQuery) - Как создать собственный сортировщик для моих нужд здесь - PullRequest
0 голосов
/ 11 октября 2011

плагин jQuery tablesorter работает не слишком хорошо для одного конкретного случая.По сути, я просто хочу, чтобы это сортировалось между текстом «None» и «ANETHING ELSE» ... но я не могу понять, как это сделать (или даже с чего начать, правда ...).

Столбец № 3 заполнен множеством различных возможностей, но я хочу сделать просто:

  1. Когда ячейка содержит текст, «Нет»
  2. Когдаячейка содержит НИЧЕГО, ЧТО-ЛИБО ВСЕ ....

Заранее спасибо.

Прямо сейчас вызов выглядит так:

$(document).ready( function () {
            // TableSorter
                $("#dt-results") 
                .tablesorter({
                                widgets: ['zebra'], 
                                sortList: [[0,1]],
                                headers: { 
                                    1: { 
                                        sorter:'currency' 
                                    }
                                }, 

                                textExtraction: function(node) {
                                    return $(node).text();
                                }

                })
                .tablesorterPager({container: $("#pager")})
                .tablesorterFilter({filterContainer: $("#filter-box"),
                              filterClearContainer: $("#filter-clear-button"),
                              filterCaseSensitive: false,
                              filterWaitTime: 10});
        });

1 Ответ

1 голос
/ 20 октября 2011

посмотрите на обновленный код: http://jsfiddle.net/L4PFn/9/

Вы, конечно, можете сделать код чище. но на данный момент логика ... textExtraction: function(node) дает вам html / content столбца, и вам нужно вернуть текст, который будет использоваться при сортировке.

Итак, первый шаг - как определить, что в настоящее время текстовое извлечение находится в столбце пользователя. Для этого вы можете использовать уникальный атрибут класса для содержимого пользовательского столбца. в моем примере я добавил usercol как класс

<div class="outer usercol">
  <div class="inner">
     <div style="line-height:12px; margin-bottom:10px;">Bobb Johnson<br>&nbsp;&nbsp;&nbsp;<em>STATUS</em><br>
     </div>
  </div>
</div>

и

<div class="outer usercol">None</div>

и textExtraction добавить

if($(node.innerHTML).hasClass('outer') && $(node.innerHTML).hasClass('usercol') ){
}

это if утверждение говорит нам, что мы находимся в нашем столбце пользователя

Следующий шаг - проверить, является ли содержимое текущего столбца «Нет». если «None», то вернуть «z» или «a», так как это гарантирует, что «none» будет сверху или снизу при сортировке

if($.trim($(node).text()) == 'None'){
  return 'z'; //so that none comes last
}

в противном случае вы можете либо вернуть $(node).text();, либо лучше - развернуть до name. Вы можете добавить имя в span, присвоить ему уникальное имя класса и затем вернуть $(node.innerHTML).find('span.unique-class-name').text()

...