Как можно реализовать функции поиска/поиска, используя Dojo?

Я хочу реализовать функцию "прямой поиск" или "поиск предложений" в веб-приложении, использующем Dojo Framework. Это было бы похоже на то, как поисковые запросы Google и Bing отображались по мере ввода: при вводе в поле поиска список потенциальных совпадений приведен ниже. Поиски будут выполняться на стороне сервера, а результаты будут отправлены обратно в браузер с помощью AJAX.

Кто-нибудь знает хороший способ реализовать это с помощью Dojo?

Вот несколько возможных вариантов:

  • Встроенный виджет dijit.form.ComboBox
    Это очень похоже на функциональность, но я видел, что она используется с ограниченными наборами данных. В примерах всегда используются небольшие списки (например, 50 штатов в США) и предварительно загружают весь набор данных для фильтрации на стороне клиента. Однако я предполагаю, что могу подключить его к dojox.data.JsonQueryRestStore для поиска на стороне сервера - может ли кто-нибудь подтвердить, работает ли это?

  • QueryBox http://marumushi.com/code/querybox/
    Эта реализация в основном выполняет эту работу, но она содержит некоторые незначительные ошибки и не похожа на ее поддержку. Мне нужно будет сделать некоторые исправления в коде перед его использованием.

  • Medryx http://blog.medryx.org/2008/09/10/dijitsearch-part-2/
    Это также похоже на то, что он выполняет эту работу, но описывается как код "альфа-уровня", и ссылка на код кажется сломанной...

Возможно, я мог бы сделать одну из вышеупомянутых работ, но я хотел бы знать, есть ли там какие-то лучшие альтернативы.

Ответы

Ответ 1

Я реализовал его 5 лет назад, когда Dojo составлял 0,2:

Пока код древний, это тривиально, и, надеюсь, он даст вам идеи о том, как атаковать его. Грубый эскиз:

  • Прикрепите обработчик событий к вашему ящику ввода, который запускается при изменениях — используйте "onkeyup", чтобы обнаружить изменение в поле ввода.
  • Подождите, пока пользователь не перестанет печатать, установив таймер в обработчике событий, если он еще не установлен. 200-500 мс - хорошее время ожидания.
    • Тайм-аут играет двойную роль:
      • Он блокирует наши запросы на сервер, чтобы предотвратить перегрузку.
      • Он играет на нашем восприятии времени и наших типизирующих привычках.
  • Если наш тайм-аут завершен, и мы не дождаемся сервера → отправьте сервер, который у нас есть до сих пор.
  • Если мы все еще ждем сервера, отмените запрос и спросите еще раз.
    • Эта часть специфична для приложения: мы не хотим перегружать сервер, а иногда сервер не может нормально работать с поврежденными соединениями.
    • В этом примере я не отменю вызов XHR, но дождитесь его завершения, прежде чем отправлять новый запрос.
  • Сервер отвечает соответствующими результатами, которые отображаются в кратчайшие сроки.

В блоге я реализовал его как виджет. Очевидно, что точная упаковка зависит от вас.