EasyUI中combobox的使用

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/Thinkingcao/article/details/65445016

Combobox用法和方法参数:

1、 需要引入class=" easyui-combobox”

2、 参数设置需要在data-options中设置

3、 属性参数配置:

valueField:"id "   基础数据值名称绑定到Combobox(提交值)

textField:"text"    基础数据的字段名称绑定的Combobox(显示值)

mode:定义当文本改变时如何加载列表数据,当设置为remote模式下,什么类型的用户将被发送http请求参数名为'q'的服务器,以获取新的数据。

url:从远程URL来加载列表数据

method:http方法检索列表数据

data:列表中被加载的数据 (可以为自己组装的一个JSON也可以为后台获取)

<input class="easyui-combobox" data-options="
		valueField: 'id',
		textField: 'text',
		data: [{
			id: 'java',
			value: 'Java'
		},{
			id: 'perl',
			value: 'Perl'
		},{
			id: 'ruby',
			value: 'Ruby'
		}]" />
            

filter:定义如何过滤本地数据“模式”设置为'local'

formatter:定义如何呈现行

loader:定义如何从远程服务器加载数据

4、 事件:

onBeforeLoad(param): 操作之前将数据加载,返回false就取消这个荷载作用

onLoadSuccess():触发时,远程数据加载成功

onLoadError:触发时,远程数据加载错误

ONSELECT:触发,当用户选择一个列表项

onUnselect:触发,当用户取消选择一个列表


5、方法:

options():返回选择对象

getData():返回加载的数据

loadData(data):加载列表数据

reload(url):重新加载远程数据列表

setValues(values):设置combobox的值数组

setValue(value):设置combobox的值

clear():清空combobox的值

select(value):选中指定的值

unselect(value):取消指定的值

没有更多推荐了,返回首页