1、创建Editor
{ field: 'categoryname' ,width:100,title:'所属类别' ,editor:{type: 'combobox',options:{ valueField: 'id', textField: 'text', panelHeight: 'auto' }} }
设置panelHeight: 'auto' 使其不会出现一大片空白!
2、在双击编辑该行是调用ajax 请求后台返回参数
onDblClickRow : function(rowIndex,rowData){ if (editRow != undefined) { $("#admin_gamelist_datagrid").datagrid('endEdit', editRow); } if (editRow == undefined) { $("#admin_gamelist_datagrid").datagrid('beginEdit', rowIndex); editRow = rowIndex; $("#admin_gamelist_datagrid").datagrid('unselectAll'); } synchCategory(rowIndex,rowData); },
synchCategory(rowIndex,rowData); 该方法为请求方法。
3、将返回的值加载进combobox
function synchCategory(rowIndex,rowData){ var jqData; var url = '${pageContext.request.contextPath}/skipController/secCate.do?pid=' +rowData.pcategoryid; var ed = $('#admin_gamelist_datagrid' ).datagrid( 'getEditor',{index:rowIndex,field: 'categoryname' }); $.ajax({ url:url, dataType : 'json', type : 'POST', success: function (data){ jqData = data; $(ed.target).combobox( 'loadData' , jqData); } }); }
4、后台处理逻辑
@RequestMapping ("/secCate" ) @ResponseBody public List<Pcategory> cateSecList(String pid){ List<Pcategory> CateSecList = categoryService .getCateSecList(pid); return CateSecList; }
5、效果如图所示:
效果一
效果二
相关推荐
本文给大家分享jQuery EasyUI编辑DataGrid用combobox实现多级联动效果的实例代码,代码简单易懂,非常不错,具有参考借鉴价值,感兴趣的朋友一起看看吧
easyui的datagrid中editor和combobox的级联,在datagrid中编辑项是下拉框的实现方式
easyui datagrid 行编辑时 1、类型为combogrid时每行的参数不同查询返回对应的数据结果。 2、类型为combobox时,输入框显示图标按钮,实现对应的事件。 3、解决类型为combobox显示为value而不是text问题。
easyui 可编辑datagrid完整例子,支持filebox 项目中的数据库使用的是mysql,内置sql脚本,执行脚本即可创建数据
修改上一个资源版本中结束编辑时combobox显示问题. 1、类型为combogrid时每行的参数不同查询返回对应的数据结果。 2、类型为combobox时,输入框显示图标按钮,实现对应的事件。 3、解决类型为combobox显示为value而...
主要介绍了如何解决easyui自定义标签 datagrid edit combobox 手动输入保存不上,需要的朋友可以参考下
JS EasyUI DataGrid动态加载数据
在easyui 的datagrid编辑状态下实时更新其他处于编辑或者没在编辑下的列值,并在结束编辑后得到的row的数据为更改后的数据。
NULL 博文链接:https://focus-sunbo.iteye.com/blog/2198721
easyUI页面datagrid动态列和form字段动态添加;项目开发时用到的,废了不少事,大概总了一下,现在发出来共享给想我一样的要用到的菜鸟们,谢谢
jquery easyui 扩展 datagrid 自定义动态隐藏显示列
easyui的datagrid的数据渲染
easyui datagrid 嵌套datagrid form 简单提交 ,刷新子表数据
easyui datagrid editor回车切换单元格示例,适合熟悉easyui但又不懂如何做的人员,可能参考一下源码JS。
当在datagrid行内部应用添加编辑操作时,引入combobox是非常方便的操作,我在引入combobox时对数据源这快做个总结,在做demo的过程中遇到个问题,就是当你选择了下拉框的值后点击保存,此时显示的是value值,而不是...
easyui的datagrid中editor和combobox的级联
easyui-datagrid之间拖拽效果demo
基于.net + mvc4 写EasyUI的小网页程序,数据库用的是SQL SERVER 2008R2,集成了DataGrid(数据表格)的很多操作应用 、Combobox的级联操作,以及 Excel的导出功能等等,相信对于初学者有很大的帮助,觉得值10分。...
支持datagrid扩展,在一条记录下面可以嵌套一个子datagrid,切记要在页面中引入该js