Реализация клиентской сортировки на странице после загрузки - PullRequest
Новая
       14

Реализация клиентской сортировки на странице после загрузки

0 голосов
/ 02 марта 2010

Я разрабатываю веб-приложение, которое отображает список продуктов (скажем, 10 наименований) для пользователя. У пользователя есть возможность отсортировать результат по цене, марке и т. Д. Данные загружаются из базы данных, и это довольно небольшой список. Как мне отсортировать результаты по их атрибутам, что является постоянным. Подскажите мне о реализации сортировки на стороне клиента . Имеет ли dojo toolkit что-нибудь для сортировки небольшого списка на основе пользовательского ввода.

Причины, по которым я убежден в сортировке на стороне клиента:

  • Результирующий набор небольшой, до 10 элементов и может отображаться на одной странице.
  • Во-вторых, все атрибуты элемента (для сортировки) доступны на стороне клиента и не требуют попадания в базу данных.

Поправь меня, если я ошибаюсь; Также, пожалуйста, дайте мне знать, есть ли какие-либо проблемы в этом подходе / я пропускаю что-нибудь важное?

В поисках ценных комментариев.

Заранее спасибо.

РЕДАКТИРОВАТЬ: Если быть точным, я работаю над созданием WishList, и он имеет только выбранные элементы. У пользователя есть возможность сортировки по цене (от низкой к высокой или наоборот), по торговой марке (A-Z или Z-A). Я буду отображать всю строку, и мне нужно обеспечить сортировку по всем атрибутам строки на основе выбора поля со списком. Могу ли я сделать это с помощью dojo AJAX или просто JavaScript?

1 Ответ

1 голос
/ 02 марта 2010

Возможно, вы захотите использовать AJAX для этого, потому что, если пользователь сортирует по другому столбцу, например, цена, она будет хотеть самый дешевый продукт из всех, а не только тот, который вы показываете. Я не уверен, что есть у Dojo для работы с Ajax, но в Prototype это довольно просто:

http://prototypejs.org/learn/introduction-to-ajax

Если вы действительно хотите отсортировать только те элементы, которые отображаются в данный момент, используйте Array.sort:

https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Objects/Array/sort

Предположим, что ваши элементы отображаются в виде строк в таблице. Используя Prototype, вы можете собрать их в массив следующим образом: 

var items = $$('tr.item');

Тогда вы бы использовали метод sort для сортировки массива items: 

items.sort(function (i1, i2) {
  return price(i1) - price(i2);
})

Затем заменить содержимое таблицы: 

var t = $$('table.items');
t.update();
items.each(function (i) { t.appendChild(i); });
...