2012-05-30 10 views
9

Mam tabela, którą ładuję za pomocą polecenia ładowania jQuery. w wywołaniu funkcji ładowania inicjuję wtyczkę tablesorter. Z jakiegoś powodu tabela tylko sortuje malejąco, nie rosnąco. Jeszcze dziwniejsze, jeśli przytrzymam shift, to będzie prawidłowo przełączać pomiędzy asc i desc? Masz pojęcie, co się tutaj dzieje?jquery tablesorter tabela ajax sortowanie tylko w jednym kierunku

Table.php

<table id="xyz"> 
<thead> 
    <tr> 
     <th>hi</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
     <td>a</td> 
    </tr> 
    <tr> 
     <td>b</td> 
    </tr> 
    <tr> 
     <td>c</td> 
    </tr> 
</tbody> 
</table> 

jquery

$("#myDiv").load("table.php", function() { 
    $("#xyz").tablesorter(); 
}); 

jeśli nie załadować tabelę za pośrednictwem AJAX następnie funkcje tablesorter jak oczekiwano.

+0

Jeśli kliknę naprawdę szybko, że wygląda to nie sort sortuje rosnąco malejąco ale potem znowu. –

+3

Czy deklarujesz '.tablesorter()' gdziekolwiek indziej w twoim pliku? może być podwójne wiązania ... – Jason

+0

dobra myśl, ale nie jestem tylko nazywając .tablesorter() raz –

Odpowiedz

9

Okej, więc byłem podwójnie wiążący, tak jak myślał Jason.

Właściwie nazywałem funkcję ładowania jQuery w klasie i miałem dwie jednostki div z tą klasą na mojej stronie. Tak właściwie to było wywołanie funkcji zwrotnej dwa razy?

Myślę, że to dziwne zachowanie, ponieważ zawartość ładowana do obu elementów div była taka sama, ale wygląda na to, że jQuery wykonuje osobne wywołanie ajax dla każdego z elementów div. Dzięki za komentarze!

+0

Miałem ten sam problem, ładowałem dwie wersje jquery w głowę. Twoje pytanie pozwoliło mi to rozgryźć, dzięki –

1

Problem został już rozwiązany, ale wspomnę, że miałem ten sam problem. Powód był w starej wersji jquery: Miałem 1.4.2, 1.4.4 było potrzebne.

5

Pomyślałem, że podam tu jeszcze jedną odpowiedź na wypadek, gdyby ktoś inny w to wszedł. Stało się tak, gdy próbowałem wywołać .tablesorter() na tabeli przy użyciu selektora klasy zamiast selektora id. Tak zmieniając go z

$('.tablesorter').tablesorter();

do

$('#tablesorter').tablesorter();

(i znaczników w celu odzwierciedlenia tego) ustalony ten problem dla mnie.

5

Po raz kolejny, widząc jak to zostało rozwiązane, chciałbym podzielić się moim innym scenariuszem.

Moje ciało wiersze tabeli są tworzone dynamicznie z .ajax rozmowy, gdy użytkownik dodaje/modyfikuje/usuwa wiersz, to w tabeli wiersze ciała są .removed() i odtworzone z tego samego .ajax rozmowy poprzez function(). To oczywiście podwójnie wiąże tabele, ponieważ pozostaje stół, co powoduje dziwne zachowanie.

Rozwiązaniem dla mnie było, aby rozwiązać ten tablesorter przed inicjowanie $('#mytable').addClass('tablesorter').tablesorter(); jak tak:

$('#mytable') 
    .unbind('appendCache applyWidgetId applyWidgets sorton update updateCell') 
    .removeClass('tablesorter') 
    .find('thead th') 
    .unbind('click mousedown') 
.removeClass('header headerSortDown headerSortUp'); 

Kolejna poprawka może być stworzenie całą tabelę w zaproszeniu zamiast .ajax tylko ciała <tr> „s.

Nadzieja to pomaga

+0

Prawidłowa odpowiedź dla mnie, ponieważ nie mogłem znaleźć sposobu w dokumentacji wtyczki, aby usunąć poprzednie powiązanie. – AdityaSaxena

1

miałem ten sam problem, ale inną konfigurację, a odpowiedź zauważyć w tym wątku już nie mój problem rozwiązany. Dodanie rozwiązania dla mojego scenariusza na wypadek, gdyby ktoś inny miał ten sam problem, który miałem.

moim stole rzędy ciała są tworzone dynamicznie z wywołania .ajax na stronie obciążenia i jedna kolumna jest ustawiona jako domyślna sortList posortować po dane są ładowane.

5 z 10 kolumn są ponownie wypełniane na podstawie złożenia nowego zakresu dat. Nie odbudowuję ciała tabeli, ale raczej wstrzyknęłam dane do odpowiednich rekordów, a następnie uciekłam w oparciu o moją domyślną listę sortowania.

Mój problem było to, że po złożeniu nową gamę data, tablesorter teraz zdefiniowane dwa razy w nagłówku, klikając nagłówek tak by porządek dwukrotnie, pojawiające się tylko w jeden sposób sortowania.

Moje rozwiązanie było zapobiec nagłówek tablesorter z inicjowany jest dwukrotnie. Na stronie obciążenia, I niech tablesorter rodzaj jedna kolumna ustawić w nieruchomości sortList ja ustawiony, ale każda nowa data zakres zgłosił, że użytkownik następujące linie do sortowania moją kolumnę po obciążeniu danych:

$('#mytableBody').trigger("update"); 
var sorting = [[5, 1]]; 
setTimeout(function() {$('#mytableBody').trigger('sorton', [sorting]) }, 1); 

używam setTimeout aby upewnić się, że dane są w pełni załadowane przed sortowaniem.

Mam nadzieję, że to pomoże.

Powiązane problemy