如何使用Dojo实现实时搜索/搜索建议？

Question

我想在使用Dojo Framework的Web应用程序中实现“实时搜索”或“搜索建议”功能。这类似于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/
  这也看起来像它的工作，但它被描述为'alpha级'代码，代码的链接似乎被打破...

我可能会完成上述工作之一，但我想知道是否有更好的选择。

Answer 1

我在5年前Dojo处于0.2：

时实施了它

• http://www.lazutkin.com/blog/2005/12/23/live-filtering/

虽然代码很古老，但它很简单，希望它会给你如何攻击它的想法。粗略的草图：

• 将事件处理程序附加到输入框，在更改时触发 - 使用“onkeyup”检测输入框中的更改。
• 等待用户通过在事件处理程序中设置计时器来停止输入（如果尚未设置）。 200-500ms是很好的等待时间。
  • 超时扮演双重角色：
    • 它会限制我们对服务器的请求以防止过载。
    • 它影响我们对时间和打字习惯的看法。
• 如果我们的超时时间已到，我们不等待服务器⇒向服务器发送一个我们到目前为止的字符串。
• 如果我们还在等待服务器，请取消请求并再次询问。
  • 这部分是特定于应用程序的：我们不希望重载服务器，有时服务器无法很好地处理断开的连接。
  • 在示例中，我不会取消XHR呼叫，而是在提交新请求之前先等待它完成。
• 服务器响应相关结果，并立即显示。

在博客文章中，我将其实现为小部件。显然，确切的包装取决于你。