jquery easyUI中combobox的使用总结

jquery easyUI中combobox的使用总结

一、如何让jquery-easyui的combobox像select那样不可编辑?
为combobox添加editable属性 设置为false
$('#goods_series').combobox({
url:"xxx/getBrandsGoodsSeries",
valueField:'goods_series',
textField:'goods_series',
editable:false
});
获取值：
'goods_series':$("#goods_series").combobox("getValue"),
表单：
<input class="easyui-combobox" type="text" id="goods_series" name="goods_series"/>

二、让combobox可输入，为combobox添加editable属性 设置为true，输入内容是作为搜索下拉框里面值的快捷方式，可以设置本地和romote两种方式

三、如何让combobox兼容选择和输入，并把输入的内容作为新增内容？
easyui本身输入的只是作为搜索快捷方式，没有提供api接口可以直接获取到输入框里面的内容，也不能直接根据ID或者input里面的值（输入框是combobox组件自动添加的，没有ID）。
通过大量测试实战结果得出的一个解决方法是：获取所有.combo-text然后获取父节点上一个兄弟节点，判断comboname（组件自动添加的）属性值为对应input的name时获取这个input的值
function getGoodSeries(){
var value = "";
//console.log($(".combo-text"));
$.each($(".combo-text"),function(i,o){
//console.log($(o).parent().prev().attr('comboname'));
if($(o).parent().prev().attr('comboname') == 'goods_series'){
//console.log($(o).val());
value = $(o).val();
}
});
return value;
}
//提交表单获取值的时候使用：var goods_series = getGoodSeries();

function goodsbrandSelect(){
$('#goods_series').combobox({
url:"xxx",
valueField:'goods_series',
textField:'goods_series',
//hasDownArrow:false,
editable:true
});
}

级联方式在上一个combobox的data-options里面加上onSelect:goodsbrandSelect,onLoadSuccess:goodsbrandSelect

四、editable:true + hasDownArrow:false 可以作为一组打造自动提示输入框没有下拉框的效果。

五、onChange事件可以在有级联项时，作为清空级联项值的一个扩展点。但是并不能作为载入级联项值的地方，因为此时主combobox还没选中。
载入级联项值的地方应该是在onSelect和onLoadSuccess事件中，function中传入有参数rec，也就是选中的那条记录

六、onBeforeLoad函数会在两种情况下触发：1.combobox初始化的时候 2.remote方式发起请求成功收到服务器传来的值时
其中1初始化时无论载入方式是local还是remote，是url还是data方式，都会触发onBeforeLoad。
当通过url载入数据onBeforeLoad返回false，就无法载入数据，通过data载入数据无论onBeforeLoad返回什么，combobox都已经有data数据了。
可以利用这个函数处理local模式下的级联等。
onBeforeLoad若return true那就会发起请求到服务器请求数据，若成功获得数据，就会触发onLoadSuccess

七、group可以展现两层树形目录形式方便用户选择，设置示例：
groupField:'gf',
groupFormatter:function(group){
return function(group){
//doSomething
};
},
这里的groupField就是需要group的字段，一般这个字段存的都是id或code等。
在groupFormatter中将其匹配成显示内容。

 另外在火狐下他会缓存上次选择后的下拉框内容，即默认缓存input的值,只有使用ctl+F5强制刷新的才可以清除 缓存记录。需要加个参数让他不要缓存,在不想使用缓存的input 中添加 autocomplete="off" 或者在 input 所在的form 标签中添加 autocomplete="off";