Динамическая сортировка таблицы
var directions = [];
var currentcol = [];
function sorttable(tableId, col)
{
var data = [];
var table = document.getElementById(tableId);
var rows = table.getElementsByTagName('tr');
if(directions[tableId]==undefined) directions[tableId] = new Array();
if(directions[tableId][col]==undefined) directions[tableId][col] = false;
else directions[tableId][col] = !directions[tableId][col];
if(currentcol[tableId] != col)
{
currentcol[tableId] = col;
directions[tableId][col] = false;
}
for(var i = 0; i < rows.length; i++)
{
//Пропустить строку заголовка (если нет элементов <td>, а только <th>)
var cells = rows[i].getElementsByTagName('td');
if(cells.length == 0) continue;
var row = [];
for(var j = 0; j < cells.length; j++)
{
row.push(cells[j].innerHTML);
}
//Сохраняем элемент <tr>
row.originalTr = rows[i];
data.push(row);
}
data.sort(function(a,b){
//Если в ячейке число - сортируем по нему
if(!isNaN(a[col]) && !isNaN(b[col]))
return !directions[tableId][col] ? parseFloat(a[col]) > parseFloat(b[col]) : parseFloat(a[col]) < parseFloat(b[col]);
else
return !directions[tableId][col] ? a[col] > b[col] : a[col] < b[col];
});
for(var i = 0; i < data.length; i++)
{
var tr = data[i].originalTr;
//Убрать из текущего места и добавить в конец
tr.parentNode.removeChild(tr);
table.appendChild(tr);
}
}
Ну, и пример данных.
<table id="table1">
<tr>
<th>Место</th>
<th onclick="sorttable('table1',1)">Страна</th>
<th onclick="sorttable('table1',2)">Площадь</th>
</tr>
<?php
$fp = fopen('Страны.csv','r');
while($line = fgetcsv($fp,1024,';') )
{
?>
<tr>
<td><?php echo $line[0]?></td>
<td><?php echo $line[1]?></td>
<td><?php echo intval($line[2])?></td>
</tr>
<?php
}
?>
</table>
Получится:
<tr>
<td>1</td>
<td>Россия </td>
<td>17075400</td>
</tr>
<tr>
<td>2</td>
<td>Канада </td>
<td>9976139</td>
</tr>
<tr>
<td>3</td>
<td>Китайская Народная Республика (КНР) </td>
<td>9598961</td>
</tr>
...
Проверено пока только в Firefox.
|
>>If child is a reference to an existing node in the document, appendChild moves it from its current position to the new position (i.e. there is no requirement to remove the node from its parent node before appending it to some other node).
т.е нет необходимости в
проверку направления стоит вынести из sortFunc (сортировать всегда в одном направлении),
а затем при вставке выбрать направление цикла :
доработал - http://jsfiddle.net/ivangalin/ufEVA/
работает в Chrome 15 и FF 3.6
Спасибо - и за замечание, и за доработку.
Отправить комментарий
Приветствуются комментарии:Для остальных вопросов и обсуждений есть форум.