combogrid翻页后保持显示内容为配置的textField解决办法
easyui的combogrid当配置pagination为true进行分页时,当datagrid加载其他数据页,和上一次选中的valueField不匹配时,会导致combogrid直接显示valueField的值,而不是textField的值。
第一页包含valueField,可以选中记录和正常显示textField的值
第二页未包含valueField,datagrid没有选中的记录,combogrid直接显示出valueField的值。
combogrid翻页后保持显示内容为配置的textField解决办法源代码如下
<input type="text" id="combogrid" value="FI-SW-011" /> <script> //FI-SW-011对应的显示值为Koi1,这里示例直接写死,实际应用需要从数据库中读取出赋值给这个变量 //如果设置了multiple为true,注意也需要从数据库读出所有对应的显示值复制给此js变量 //赋值给js变量可以用服务器端代码,如var diplayText = '<%=xxxx %>' //此变量值会在onLoadSuccess赋值给combogrid的显示对象,不再依赖combogrid相关的事件进行设置 //因为添加翻页的话,多选的值可能出现在不同的分页中 var diplayText = 'Koi1'; </script> <script> var grid = $('#combogrid'); grid.combogrid({ title: 'combogrid翻页后保持显示内容为配置的textField解决办法', panelWidth: 500, width: 230, idField: 'productid', textField: 'productname', url: 'data.asp', columns: [[{ field: 'productid', title: 'Item ID', width: 80 }, { field: 'productname', title: 'Product', width: 120}]], onSelect: function (index, row) {//选中datagrid数据行,更新displayText变量 diplayText = row[grid.combogrid('options').textField]; }, onLoadSuccess: function () { //分页后判断下是否有选中的数据行,combogrid会依据上一次选中的值进行初始化,选中datagrid数据行和设置显示值 if (!grid.combogrid('grid').datagrid('getSelected')) //不再当前页 grid.next().find('input.combo-text').val(diplayText); }, fitColumns: true, pagination: true }); </script>
加支付宝好友偷能量挖...
原创文章,转载请注明出处:combogrid翻页后保持显示内容为配置的textField解决办法