easyui的combobox下拉框默认初始值是空，下面是实现从远程加载数据之后初始化默认值,以及让该值一直排在下拉框的最顶部的方式。
目前的需求是需要在初始化的时候添加"全部数据库"字段,并且在下拉的时候,"全部数据库"一直排在最顶部。
初始化效果如下:
下拉之后的效果如下:
实现方式:
easyui的combobox有一个loader属性,easyui的API对loader属性说明如下:
easyui的combobox有一个onLoadSuccess事件,easyui的API对onLoadSuccess事件说明如下:
实现方式就是综合利用easyui的loader属性和onLoadSuccess事件。
完整的代码如下所示(请关注重点代码,红色标注的部分):
<input id="dBName" name="dBName" class="easyui-combobox" style="width: 200px"data-options="valueField: 'dbname', textField: 'dbname', editable:false,loader:function(param,success,error){$.ajax({ url: '${pageContext.request.contextPath}/rds/rds_findRdsDatabases.action?dbinstanceid=${param.dbinstanceid}', dataType: 'json', success: function(data){data.rows.unshift({dbname:'',dbname:'全部数据库'});success(data.rows); //loader的success} }); },onLoadSuccess:function(){$('#dBName').combobox('setValue','全部数据库');}"/>
上面的方法unshift()会将一个或多个元素添加到数组的头部，然后把已有的元素移动到下标较大的位置一腾出空间，它返回的是数组的新长度。
