jQuery UI AutoComplete的使用

现场提出优化单，Table Mapping里关于获取数据源下所有表名的地方由于表数量过多选择不便,需添加搜索功能。原本的实现是一个Dialog ，现打算将其改为AutoComplete。

框架使用的是jQuery UI Autocomplete 1.8.23。 据说jquery.autocomplete很好，但还是用框架已经引入的吧。

开工吧，先进菜鸟里面实践实践，找找感觉。

基础的Demo,很简单只要这样就可以了

再改改参数

一个基础功能的AutoComplete就完成了。

--------------------------------------------------------------------------------------------此处分割

AutoComplete 提供了足够用的方法、事件

常用参数如下

1.Source：用于指定数据来源，类型为String、Array、Function

• 　　String：当使用一个字符串，Autocomplete 插件希望该字符串指向一个能返回 JSON 数据的 URL 资源。
• 　　Array：可用于本地数据的一个数组。支持两种格式： 字符串数组：[ "Choice1", "Choice2" ] 带有 label 和 value 属性的对象数组：[ { label: "Choice1", value: "value1" }, ... ]
• 　　Function(request, response)：第三个变量，一个回调函数，提供最大的灵活性，可用于连接任何数据源到 Autocomplete。通过request.term获得输入的值，response([Array])来呈现数据。

2.minLength： 执行搜索前用户必须输入的最小字符数。对于仅带有几项条目的本地数据，通常设置为零，但是当单个字符搜索会匹配几千项条目时，设置个高数值是很有必要的。

3.autoFocus：如果设置为 true，当菜单显示时，第一个条目将自动获得焦点

对于source的三个数据来源，我使用了Array。这对我功能的实现已经够用。如果想要对获取的值进行再一步加工的话，可以使用Function。Function的灵活性更高些，通过request.term获得输入的值，response([Array])来呈现数据

对于事件，举个栗子

当想要焦点移动到一个条目上（未选择）时，将某控件上赋值则可使用focus事件监听，形如这样

当想要光标刚键入控件，就查询出全部。可通过search方法。就不一一列举了。可以多试试

原本Source用Function写了,后来发现其实很简短的代码就可以完成了，不需要Function,也不需要刻意写成{label : xx ,value :xx}格式