Lab 7 First Name Last Name City State J. Brent McKinley Arlington WA Jack Jones Fruitland ID Tom Butterfield Meridian ID Donald Wells Boise ID Bob Carter Sun City West AZ // Используется для применения различных стилей строк function zebraRows(selector, className) { // $(selector).removeClass(className).addClass(className); $(selector).addClass(className); } $(document).ready(function() { zebraRows('tbody tr:odd td', 'odd'); // Получим все заголовки столбцов и для каждого выполнить функцию $('thead th').each( function(column) { /******* Текущий селектор - заголовок таблицы *******/ // Для каждого заголовка добавим css класс 'sortable' и обработчик нажатия $(this).addClass('sortable').click(function() { var findSortKey = function($cell) { //return $cell.find('.sort-key').text().toUpperCase() + ' ' + $cell.text().toUpperCase(); return $cell.text().toUpperCase(); }; var sortDirection = $(this).is('.sorted-asc') ? -1 : 1; // проверяем наличие класса sorted-asc у заголовка таблиц // Пройдёмся вверх по дереву, чтобы получить строки с данными для сортировки var $rows = $(this).parent().parent().parent().find('tbody tr').get(); // Циклом пройдём по всем строкам $.each($rows, function(index, row) { // Добавляем к row атрибут sortKey, содержащий текст текущей ячейки в верхнем регистре row.sortKey = findSortKey($(row).children('td').eq(column)); }); // Сравнение и алфавитная сортировка строк $rows.sort(function(a, b) { if (a.sortKey < b.sortKey) return -sortDirection; if (a.sortKey > b.sortKey) return sortDirection; return 0; }); // Добавим строки в правильном порядке в начало таблицы $.each($rows, function(index, row) { $('tbody').append(row); row.sortKey = null; }); // Определим порядок сортировки столбца $('th').removeClass('sorted-asc sorted-desc'); var $sortHead = $('th').filter(':nth-child(' + (column + 1) + ')'); sortDirection == 1 ? $sortHead.addClass('sorted-asc') : $sortHead.addClass('sorted-desc'); // Определим столбец, по которому ведётся сортировка $('td').removeClass('sorted').filter(':nth-child(' + (column + 1) + ')').addClass('sorted'); $('td').removeClass('odd'); zebraRows('tbody tr:odd td', 'odd'); }); } ); });