easyui combobox筛选显示值 用loadFilter方法

由于工作需要，需要建立一个combobox，筛选加载过来的值的一部分。。

新建一个如下的combobox，从url中获取要显示的内容。

<input type="text" name="cbb" id="cbb" class="easyui-combobox" data-options="url:'combobox_data.json'"/>

但是由于业务原因，我可能只想显示json中的部分字段。这个时候就需要loadFilter方法。

js代码如下，加载页面的时候，获取url中的值并且全部显示。

$(document).ready(function() {//加载机构列表$.ui.combogrid.org(".org_id");$("#cbb").combobox({loadFilter:function(data){  return data;}});});

但是我需要显示其中的一部分，可以这样。根据条件把data中不想要的值删除，然后返回data。这样就时去掉了自己不想要的东西。

$(document).ready(function(){$("#cbb").combobox({loadFilter:function(data){for(var i in data){if(data[i].value == "1"){data.splice(i,1);}}return data;});});

splice() 方法可删除从 index 处开始的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。上面代码中删除i处的元素。

因为combobox是放在弹出框，而且，根据功能的需求不同，需要同一个combobox显示不同的下拉值。

这个时候，如果删除的话，重复调用loadFilter的话，继续用splice方法的话，等于是在已经缺少元素的data中继续删除。这样就达不到想要的效果。

笔者在这个基础上，想到删除前赋值给另一个数组，结果以失败告终，因为直接赋值，如下：

var data1 = data;

但是这样的赋值，data1直接指向data指向的数组，所以，如果data删除的话，data1也是指向被删除的元素。直接赋值就是浅拷贝，而浅拷贝的话，无法满足数组元素没有改变的需求。

但是这样的话，会提示我value不存在，后来发现，我应该在刚加载页面的时候，就调用loadFilter方法先加载所有url中的值。综合如下：

$(document).ready(function() {//加载机构列表$.ui.combogrid.org(".org_id");$("#cbb").combobox({loadFilter:function(data){  return data;}});});$("#business_processe").combobox({loadFilter:function(data){var data1 = [];for(var i in data){if(data[i].value==1){data1.push(data[i]);}if(data[i].value==3){data1.push(data[i]);}}return data1;  }  });

这样的话，可以直接再次调用loadFilter方法，如下：

$("#business_processe").combobox({loadFilter:function(data){var data1 = [];for(var i in data){                        //条件项的不同                       if(data[i].value==4){data1.push(data[i]);}if(data[i].value==6){data1.push(data[i]);}}return data1;  }  });

后来经过同事指导，条件项可以简化成如下：

$("#business_processe").combobox({loadFilter:function(data){var data1 = [];for(var i in data){                                                                        //注意条件项的变化，-1 代表未匹配                                                                       if("13".indexOf(data[i].value)>-1){data1.push(data[i]);}}return data1;}});