Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.06.2011, 11:31
Новичок на форуме
Отправить личное сообщение для Leopardoff Посмотреть профиль Найти все сообщения от Leopardoff
 
Регистрация: 13.05.2011
Сообщений: 7

Сортировка таблицы - просто и со вкусом
Написал небольшой плагин для сортировки таблиц. Знаю, что есть jqueryTablesorter, но он слишком большой. Решил выставить на обсуждение.
// TableSorter plug-in
/*
Функция TableSorter.sort сортирует таблицу table по столбцу col, используя при этом функцию fun.
Необязательный аргумент likeNum (default=false) заставляет рассматривать значения ячеек как числа.
*/
var TableSorter = {};
TableSorter.sort = function(table,col,fun,likeNum){
	//Метод прототипа для массивов, который переставляет элементы с индексам
	//firstIndex и secondIndex местами
	Array.prototype.swap = function(firstIndex,secondIndex){
		c=this[firstIndex];
		this[firstIndex] = this[secondIndex];
		this[secondIndex] = c;
	}
	//Определяем тело таблицы
	var tbody = table.tBodies[0];
	//Определяем все строки внутри тела таблицы
	var trs = tbody.rows;
	//Сюда будут помещены значения ячеек сортируемого столбца
	var sortedTds = new Array();
	//Порядок следования ячеек в сортируемом столбце
	var tdsNums = new Array();
	
	for(var i=0;i<trs.length;i++){
		//Преобразуем (или не преобразуем) значение ячейки в число в зависимоси от likeNum
		var content = likeNum?parseFloat(trs[i].cells[col-1].innerHTML):
							  trs[i].cells[col-1].innerHTML;
		//Заносим значение ячейки в массив
		sortedTds.push(content);
		//Заносим индекс в массив индексов
		tdsNums.push(i);
	}
	//Сортируем массив sortedTds методом пузырька, при
	//этом также переставляя местами элементы в массиве индексов
	for(var i=0;i<sortedTds.length;i++){
		for(var j=0;j<sortedTds.length-i-1;j++){
			if(fun(sortedTds[j],sortedTds[j+1])) {sortedTds.swap(j,j+1);tdsNums.swap(j,j+1)}
		}
	}
	//Создаем контейнер
	var container = document.createDocumentFragment();
	//Поочередно запихиваем в контейнер строки таблицы,
	//вставляя при этом в нее новые строки, чтобы индексы не сбились
	for(var i = 0;i<tdsNums.length;i++){
		tbody.insertRow(tdsNums[i]+1);
		container.appendChild(trs[tdsNums[i]]);
	}
	//Очищаем тело таблицы.
	//Здесь подошел бы innerHTML='', но IE его не поддерживает
	while(tbody.rows.length>0){tbody.deleteRow(0);}
	//Добавляем отсортированные строки таблицы в пустое тело.
	tbody.appendChild(container);
}

Использование:
window.onload = function(){
	var table = document.getElementById('sortedTable');
	var sortFun = function(a,b){return a>b;}
	TableSorter.sort(table,2,sortFun,true);
}

<table id="sortedTable">
<tr><td>34</td><td>45*</td></tr>
<tr><td>543</td><td>32?</td></tr>
<tr><td>76890</td><td>217%</td></tr>
<tr><td>123434</td><td>67.9</td></tr>
<tr><td>4536</td><td>51.9</td></tr>
<tr><td>3455</td><td>430</td></tr>
<tr><td>5667</td><td>4567)))</td></tr>
<tr><td>890</td><td>218(</td></tr>
</table>

Есть предложения по рационализации и улучшению кода?

Последний раз редактировалось Leopardoff, 02.06.2011 в 11:35.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Подсветка столбцов таблицы ctocopok Элементы интерфейса 31 14.06.2011 01:42
Сортировка таблицы. Atilla Events/DOM/Window 1 07.03.2011 17:03
Сортировка таблицы, при помощи js Prizrak177 Общие вопросы Javascript 10 02.09.2010 12:17
Ширина таблицы Syltan (X)HTML/CSS 1 01.05.2010 22:33
Перемещение строк таблицы в Firefox barcelona jQuery 17 23.02.2009 15:41