您的位置:首页 > 产品设计 > UI/UE

easyui combobox 动态加载数组数据

2018-01-25 09:44 549 查看
怕自己忘了,记录下来以后用方便

html部分

<input id="rzcode" name="businesItemId"  style="width: 100%; height: 100%;border:none" class="easyui-combobox" data-options=""  />


JS部分

var arrayData = new Array();//创建空数组
var aryData = new Array();//创建空数组
$(document).ready(function(){
//先用ajax获取到下拉框全部的数据,并放到数组一里
$.ajax({
async:false,//同步加载
type:"post",
url:"${ctx}/basic/businessItem/list/all?campId=${campId}&groupId=${groupId}",
dataType:"json",
success: function(data){
arrayData = data
}
});
      //combobox操作
$('#rzcode').combobox({
         //先把全部数据复制 
valueField: 'id',
textField: 'name',
data:arrayData,
         //数据改变时
onChange:function(newValue,oldValue){
if(newValue != ""){
for(var i=0;i<arrayData.length;i++){
var code = arrayData[i].code;
var ss = code.indexOf(newValue);
                //输入的newValue是否匹配原有数据的code
if(ss != -1){
                   //先清空第数组二,再重新放到数组二里
aryData = new Array();
aryData.push(arrayData[i])
}
}
              //修改数据
$(this).combobox("loadData", aryData);
}else{
              //如果输入空格,依然还是全部的数据
$(this).combobox("loadData", arrayData);
}

},
});


大体效果

输入空格 或 全部删除后

加载全部



输入的跟code匹配

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: