Autocomplete自动补全模块

2024-07-11 23:41:03首发，2个月前更新

Autocomplete是基于Popup和Retrieval模块的自动补全模块，实现对input或textarea表单域录入数据时给与自动列表提示，点击项目节点可填入项目value，是搜索模块和组件的基础模块。

Autocomplete自动补全模块 2个月前更新 Autocomplete自动补全示例和详细使用方法 需3金币 2个月前更新

简单使用

对表单域节点使用参数content填入文本值即可。

输出
HTML

```
                
                
            
```

也可以通过id+new的方式创建实例。

输出
HTML
JS

```
                
                
            
```

                
                new ax.Autocomplete('#demo01',{
                            content:'United States,Canada,United Kingdom,China,Brazil,India,France,Germany',
                        });

自定义输入内容

模块默认输出的属性是value；因为Retrieval模块所使用的数据在数据标准化过程中，已经将没有value属性的项，强制使用label替代了value，所以本页的示例呈现出来的检索结果好像是输出label，其实输出的是value。

用户可通过field参数设定输出值的属性，比如field:'label'。

输出
HTML

```
                
                
            
```

基础参数

属性	类型	默认值	说明
field	string	'value'	填充值到编辑器的属性，通常为value或label

数据源参数

属性	类型	默认值	说明
content	any	''	数据源
contType	string	'text'	数据源类型
contData	object	{}	发起请求时的数据
ajax	object	{}	ajax请求参数

模板参数

属性	类型	默认值	说明
tplStr	string	''	模板字符串
tplEng	function	null	模板引擎

弹窗参数

属性	类型	默认值	说明
popup	object	{}	弹窗模块参数配置
retrieval	object	{}	检索模块参数配置

前置函数

属性	类型	默认值	说明
b4Fill	function	null	填充值之前的回调函数，支持一个预填项参数

监听事件

属性	类型	默认值	说明
onShown	function	null	窗口显示后的回调函数
onHidden	function	null	窗口关闭后的回调函数
onCleared	function	null	清除列表后的回调函数
onReset2Show	function	null	重置并强制打开后的回调函数
onUpdatedCont	function	null	内容更新后的回调函数，支持一个content参数