当前位置: 代码迷 >> Web前端 >> Easyui可编者datagrid 为combobox动态赋值
  详细解决方案

Easyui可编者datagrid 为combobox动态赋值

热度:676   发布时间:2013-10-12 11:54:04.0
Easyui可编辑datagrid 为combobox动态赋值

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、效果如图所示:


效果一


?
?效果二
?

?

?

  相关解决方案