之前尝试combobox多选的模糊过滤的时候陷入了思维误区,以为jquery自定义了特殊的过滤方法在本身的js中,而filter方法与其冲突。其实combobox的默认过滤也是基于filter实现的,只是默认的时候是以combobox的文本内容过滤。
下面是一个combobox实现多选的完美示例:
var diseaseList = [];
$CommonUI.getComboBox("#diseaseName").combobox({
valueField:'id',
textField:'text',
data:dataSoruce,
multiple:true,
required:true,
editable:true,
filter:function(q,row){
var opts = $(this).combobox('options');
var newTextList = q.split(",");
var newText = newTextList[newTextList.length-1];
return row[opts.textField].indexOf(newText) >-1;
},onSelect:function(row){
//排除相同选项被多次选择
for(i in diseaseList){
if(diseaseList[i] == row.id){
$("#diseaseName").combobox("setValues",diseaseList);
$("#diseaseName").combobox("loadData",dataSoruce);
return;
}
}
diseaseList.push(row.id);
$("#diseaseName").combobox("setValues",diseaseList);
$("#diseaseName").combobox("loadData",dataSoruce);
},onUnselect:function(row){
for(i in diseaseList){
if(diseaseList[i] == row.id){
diseaseList.splice(i,1);
}
}
},onLoadSuccess:function(){
$("#diseaseName").next().children(":text").attr("placeholder","请用英文逗号分隔选项");
}
});
//编辑下拉框文本时的操作
$("#diseaseName").next().children(":text").blur(function(){
var newList = $("#diseaseName").combobox("getText").split(",");
var newCodeList =[];
for(i in newList){
$.ajax({
type:'post',
async:false,
dataType:'json',
url:$WEB_ROOT_PATH+'/basecode/baseCodeCtrl.htm?BLHMI=findBaseCodeByDiseaseName',
data:{'dto.baseCode.codeSystem':diseaseCategory,'dto.baseCode.displayName':newList[i]},
success:function(code){
if(code != null){
newCodeList.push(code);
}
}
});
}
diseaseList = newCodeList;
$("#diseaseName").combobox("setValues",diseaseList);
$("#diseaseName").combobox("loadData",dataSoruce);
});