easyui之 combobox自动补全(多选)

阅读 88

2022-06-16

1、easyui的combobox组建设置multiline和multiple两个属性为true时,表示可以多选;

2、默认,combobox多选想之间是通过英文的逗号“,”隔开的,即在文本框中输入英文逗号就可以开始一次新的自动不全操作,这对于输入中文来说很不方便,每次选中一项后还得切换到英文输入逗号然后在开始下一次输入不全。。。但combobox提供了separator属性,通过它可以设置使用什么分割;

3、扩展filter方法,因为combobox就是通过该方法进行自动不全匹配的,源码默认是return row[opts.textField].indexOf(q) ==0;; 表示联想出来的内容以输入内容开头,这样没法达到模糊匹配的需求,所以修改成>-1;

4、默认,当从combobox的联想下拉菜单中选中一项后,光标没法定位到输入框文字后面,通过onSelect事件,可以做到这一点。


5、一旦使用了separator后,编辑时回显就无法回显了,easyui默认使用英文进行分割,所以setValues时如果要回显必须按照separator指定的格式进行设置。

实例:

$("#adFilterCmp").combobox({
valueField: 'id',
textField: 'text',
multiple:true,
multiline:true,
editable:true,
separator:' ',
filter: function(q, row){
var opts = $(this).combobox('options');
return row[opts.textField].indexOf(q) >-1;;
},
onSelect:function(record) {
$("textarea").focus();
},
url:'<%=basePath %>report/getAds'
});




精彩评论(0)

0 0 举报