Шаг 134.
Библиотека jQuery. Работа с таблицами. Разбивка на страницы с помощью JavaScript. Разбивка на страницы с сортировкой

    На этом шаге мы рассмотрим реализацию разбивки на страницы с сортировкой.

    Мы начали этот раздел с замечания, что функции сортировки и разбивки на страницы должны взаимодействовать между собой во избежание обескураживающих результатов. Теперь, когда у нас имеется работающий элемент выбора страниц, необходимо, чтобы операция сортировки осуществлялась с учетом номера текущей страницы.

    Для выполнения такой задачи достаточно вызвать функцию repaginate() после завершения операции сортировки. Однако область видимости функции делает это проблематичным. Мы не вправе вызвать функцию repaginate() из процедуры сортировки, потому что она определена внутри другого обработчика $(document).ready(). Можно было бы просто объединить эти два фрагмента программного кода, но давайте поступим немного хитрее. Мы можем ослабить связь между реализациями так, чтобы функция сортировки вызывала repaginate, только если она существует, и игнорировала ее в противном случае. Для этого мы будем использовать обработчик искусственного события.

    В предыдущих замечаниях, касающихся обработки событий, мы ограничивались событиями, которые возбуждаются веб-браузером, такими как click и mouseup. Но методы .bind() и .trigger() не ограничиваются ими; в качестве имени события можно использовать любую строку. Благодаря данной возможности мы можем определить новое событие с именем repaginate, которое будет применяться взамен функции:

    $table.bind('repaginate', function() {
      $table.find('tbody tr').hide()
        .slice(currentPage * numPerPage,
          (currentPage + 1) * numPerPage)
        .show();
    });

    Теперь мы можем заменить вызов функции repaginate() на:

          $table.trigger('repaginate');

    Точно такой же вызов можно выполнять и в процедуре сортировки. Он не будет оказывать никакого воздействия, если в таблице отсутствует элемент выбора страниц, поэтому мы можем объединять эти две возможности по своему желанию.

    На следующем шаге мы приведем полную версию приложения.




Предыдущий шаг Содержание Следующий шаг