2009-12-23 12 views
10

Właśnie zaczynam korzystać z doskonałej wtyczki TableSorter autorstwa Christiana Bacha i muszę uzyskać bieżący kierunek sortowania kolumny. Mam kilka kolumn:jak uzyskać aktualny porządek sortowania z wtyczki tablesorter?

  • Identyfikator
  • Nazwa
  • Kategoria

ID i nazwa są ustawione na non-sortable przy użyciu

headers: { 0: {sorter: false}, 1: {sorter: false} } 

Dodaję obsługi kliknij na Nazwa, aby wystrzeliła zdarzenie sortowania w kolumnie Kategoria. Używając przykładu "Sort table using a link outside the table", jestem w stanie uzyskać nagłówek nazwy, aby wystrzelić sortowanie kategorii - ale jest to zakodowane na sztywno, aby sortować w jednym kierunku.

Jak mogę go przekonać do bieżącego kierunku sortowania kolumny Kategoria i sortowania w przeciwnym kierunku? (Potrafię manipulować odwracaniem wartości, ponieważ kolejność sortowania wynosi 0 lub 1, mogę XOR wartość, aby uzyskać przeciwną, jak var sort; sort ^= sort; - moje pytanie brzmi, jak uzyskać aktualną wartość.Nie można uzyskać aktualną wartość. ustawia obsługi kliknij kolumnę Nazwa:

$("#nameCol").click(function() { 
    var sorting = [[2, 0]];  /* sort 3rd col (Category) descending */ 
    $("#SearchResults").trigger("sorton", [sorting]); /* SearchResults is the ID of the sortable table */ 
    return false;    /* cancel default link action on a#nameCol */ 
}); 

Dzięki

Odpowiedz

1

nagłówki tabeli powinny korzystać z takich samych zdarzenie click!

$('th').click(function() { 
    handleHeaderClick(this); 
}); 

Następnie cli ck handler powinien dodać/usunąć odpowiednie klasy.

function handleHeaderClick(hdr) { 
    if ($(hdr).hasClass('headerSortDown') == true) { 
     $(hdr).removeClass('headerSortDown'); 
     $(hdr).addClass('headerSortUp'); 
    } else if ($(hdr).hasClass('headerSortUp') == true) { 
     $(hdr).removeClass('headerSortUp'); 
     $(hdr).addClass('headerSortDown'); 
    } else { 
     $('th', myTable).removeClass('headerSortUp headerSortDown'); 
     $(hdr).addClass('headerSortDown'); 
    } 
    doSomething(); 
}; 

Mam nadzieję, że to pomoże.

+0

Oczywiście, oczywiście! Skoncentrowałem się na uzyskaniu stanu za pośrednictwem niektórych wywołań API, ale jest to wyrażone w atrybucie klasy ... po prostu przetestuj to. Bardzo RESTY. Dzięki! – Val

3

Napisałem funkcję, aby zapisać bieżącą kolejność sortowania. Pomogło mi to w sytuacji, gdy stół był przebudowywany od zera.

function SaveSortOrder(tablename) { 
//returns an array of a tablesorter sort order 
var hdrorder = new Array(); 
var hdrs = $("#" + tablename + " th"); 
var arrayindex = 0; 
hdrs.each(function (index) { 
    if ($(this).hasClass('headerSortDown')) { 
     hdrorder[arrayindex] = [index, 0]; 
     arrayindex++; 
    } 
    else if ($(this).hasClass('headerSortUp')) { 
     hdrorder[arrayindex] = [index, 1]; 
     arrayindex++; 
    }  
}); 

return hdrorder; 
} 
22

Można użyć wbudowanego w sortEnd przypadku, aby uzyskać sortowanie jak wyjaśniono tutaj: https://stackoverflow.com/a/4150187/363155

$("#yourtableId").on("sortEnd", function(event) { 
    // prints the current sort order to the console 
    console.log(event.target.config.sortList); 
}); 
9

Można także nagrać ją na zewnątrz, nigdzie indziej (np w funkcji start AJAX, ..), i tylko w razie potrzeby, a nie na każde kliknięcie, z nieco mniejszym obciążeniu tak:

lastSortList=$("#mytable")[0].config.sortList; 

i przykładem do sortowania go z powrotem po ajax aktualizacji:

$("#mytable").trigger("sorton", [lastSortList]); 

Pamiętaj, aby zadeklarować pierwszy wiersz we właściwym zakresie.

+1

To rozwiązanie jest znacznie lepsze niż zaakceptowana odpowiedź. –

Powiązane problemy