На этом шаге мы приведем способ предотвращения обновления всей страницы.
Такой способ сортировки достаточно прост в реализации, но в случае его использования каждая операция сортировки будет приводить к полному обновлению страницы. Как мы уже знаем, библиотека jQuery позволяет избавиться от необходимости обновления страницы с помощью методов поддержки технологии AJAX. Если заголовки столбцов таблицы оформлены в виде ссылок, как было показано выше, в страницу можно добавить программный код, использующий jQuery, чтобы превратить эти ссылки в запросы AJAX:
$(document).ready(function() { $('#my-data th a').click(function() { $('#my-data tbody').load($(this).attr('href')); return false; }); });
Теперь после щелчка на ссылке jQuery будет отправлять серверу запрос AJAX на получение той же страницы. Когда для запроса страницы используются методы поддержки AJAX из библиотеки jQuery, они устанавливают HTTP-заголовок X-Requested-With в объекте XMLHttpRequest, чтобы сервер мог определить, что выполняется запрос AJAX. В ответ на запрос, в котором присутствует параметр, программный код на стороне сервера может предусматривать отправку только информационного наполнения элемента <tbody> без окружающей его разметки HTML. При такой реализации можно просто вставлять полученный ответ на место существующего элемента <tbody>.
Это пример использования принципа прогрессивного улучшения. Такая страница прекрасно работает и без наличия поддержки JavaScript в брaузере, так как ссылки, позволяющие выполнять сортировку, никуда не исчезают. Однако при наличии поддержки JavaScript запросы производятся с применением технологии AJAX, что позволяет выполнять сортировку без полного обновления страницы.
На следующем шаге мы рассмотрим сортировку с помощью JavaScript.