自动完成文本框使用Dojo [英] Textbox autocomplete with DOJO

问题描述

我要寻找使用道场一个文本框自动提示的简单方法。 db表，我会针对查询（使用PHP脚本，返回的JSON）拥有超过10万条记录，所以这真的不应该在的是FilteringSelect的形式或组合框，因为我显然不希望用户通过点击向下箭头键返回整个数据集。

I am looking for a simple method using DOJO for a textbox autosuggest. The db table that I'll be querying against (using a PHP script, returned as JSON) has over 100,000 records, so this really shouldn't be in the form of a FilteringSelect or a ComboBox as I clearly don't want the user to return the entire data set by clicking on the down arrow.

像jQuery和YUI其他库使污垢简单，但是是基于这个特别项目Dojo和我不愿意介绍另一个JS类。

Other libraries like JQuery and YUI make it dirt simple, but this particularly project is DOJO based and I'm loath to introduce another JS class.

推荐答案

它的工作！

即使有10万条记录了我对查询。返回速度为30ms以下。我甚至碰到数据库大小500,000条记录，并自动显示速度非常可以接受的（仍在120毫秒）。我敢肯定，我可以在PHP端有点缓存做得更好。

Even with the 100,000 records that I'm querying against. Return speeds are under 30ms. I even bumped the database size to 500,000 records, and the auto-suggest speeds are very acceptable (still under 120ms). I'm sure I can do even better with a little caching on the PHP side.

我最终使用的的QueryReadStore 和是FilteringSelect 。的 JsonRestStore 的将有可能是工作，但我发现从道场的网站一个简单的工作示例并从构建的。

I ended up using QueryReadStore and FilteringSelect. JsonRestStore would have probably worked, but I found a simple working example from the dojo site and built from that.

下面的工作道场code为自动提示文本框打一个非常大的数据集 - 短暂的甜蜜

Here's working DOJO code for an auto-suggest textbox hitting a very large data set - short and sweet:

            var vendorStore = new dojox.data.QueryReadStore({
                url: "../vms/htdocs/ajax/search.php"
            });

            var vendorSelect = new dijit.form.FilteringSelect({
                name: "vendorSelection",
                store: vendorStore,
                autoComplete: false,
                required: true,
                labelType: "text",
                placeHolder: "Search vendors",
                pageSize: 20,
                hasDownArrow: false,
                style: "width: 175px;",
                searchAttr: "company_name",
                id: "vendorSelect"
            },
            "vendorSelection");

            vendorSelect.startup();

当然，坚持＆LT;选择一个id =vendorSelection＆GT;＆LT; /选择＆GT; somwhere在页面的主体。伟大的作品。

Of course, stick <select id="vendorSelection"></select> somwhere in the body of the page. Works great.

再次感谢！

这篇关于自动完成文本框使用Dojo的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！