Łukasz "Zonix" Bulicki

Bardzo często w pracy zdarza mi się generowanie tabelek. Niby nic nadzwyczajnego. Ale sama tabela czasem nie wystarcza, przydała by się jeszcze funkcjonalność sortowania. Poniżej przykład sortowania prostej HTMLowej tabeli w JavaScript. Link do działającego pliku HTML.
Kod tabeli [HTML]:

Down
Nazwisko
Up


Down
Ocena
Up



Kowalski
4.5


Nowak
4.0

Tworzenie tablicy z obiektami odpowiadającymi rzędom tabeli [JavaScript]:

var uczniowie = new Array();
function uczen(Name, Ocena) {
this.Nazwisko= Name;
this.Ocena = parseFloat(Ocena);
}

Funkcja dodająca obiekt do tabeli [JavaScript]

function addToArray(Nazwisko, Ocena) {
uczniowie[uczniowie.length++] = new uczen(Nazwisko, Ocena);
}

Tworzenie obiektów odpowiadających rzędom tabel [JavaScript]:

addToArray('Kowalski', 4.5);
addToArray('Nowak', 4.0);

Funkcje sortujące [JavaScript]

function sortByUczenNazwisko(a, b) {
var x = a.Nazwisko.toLowerCase();
var y = b.Nazwisko.toLowerCase();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}
function sortByUczenNazwiskoUp(a, b) {
var y = a.Nazwisko.toLowerCase();
var x = b.Nazwisko.toLowerCase();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}
function sortByUczenOcena(a, b) {
var x = a.Ocena;
var y = b.Ocena;
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}
function sortByUczenOcenaUp(a, b) {
var y = a.Ocena;
var x = b.Ocena;
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}

Rysowanie kolumn [JavaScript]:

function drawTable() {
for (i = 0; i < uczniowie.length; i++) {
document.getElementById('nazwisko[' + i + ']').innerHTML = uczniowie[i].Nazwisko;
document.getElementById('ocena[' + i + ']').innerHTML = uczniowie[i].Ocena;
}
}

Funkcja wywołująca odpowiednie sortowanie i rysowanie tabeli [JavaScript]

function sortArray(column) {
switch (column) {
case 1 :
uczniowie.sort(sortByNazwisko);
break;
case 2 :
uczniowie.sort(sortByNazwiskoUp);
break;
case 3 :
uczniowie.sort(sortByUczenOcena);
break;
case 4 :
instytucje.sort(sortByUczenOcenaUp);
break;
}
drawTable();
}