Easyui 使用datagrid控件中的updateRow方法更新某个单元格时无效

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/LYQ2332826438

近期在做项目时,使用了easyui,在做到更新表格中的某一行数据时,遇到了调用updataRow方法时,数据更新无效的情况

表格请求数据无问题

$("#dgd_buliding_ref").datagrid({
                singleSelect : true,
                queryParams : {block_id : this.p_projectBlock_id},
                fitColumns : false,
                rownumbers : true,
                idField : 'projectBuildingId',
                url : 'building/getProjectBuildingListByBlock',
                columns : [ [
                             {
                    field : "projectBuildingId",
                    title : "工程楼号",
                    width : 80,
                    halign : 'center',
                    align : 'center'
                },{
                    field : "projectBuildingCode",
                    title : "工程楼号",
                    width : 80,
                    halign : 'center',
                    align : 'center'
                }, {
                    field : "projectBuildingName",
                    title : "营销楼号",
                    width : 80,
                    halign : 'center',
                    align : 'center'
                }, {
                    field : "productType",
                    title : "业态类型",
                    width : 100,
                    halign : 'center',
                    align : 'center',
                    formatter : function(value) {
                        var val = '';
                        $.each(buliding_ref_set.p_productTypeData, function(n, v) {
                            if (v.dictId == value) {
                                val = v.dictValue;
                                return false;
                            }
                        });
                        return val;
                    }
                }, {
                    field : "buildingGroupId",
                    title : "所属组团",
                    width : 80,
                    halign : 'center',
                    align : 'center',
                    formatter : function(value) {
                        var val = '';
                        $.each(buliding_ref_set.p_buildingGroupData, function(n, v) {
                            if (v.buildingGroupId == value) {
                                val = v.buildingGroupName;
                                return false;
                            }
                        });
                        return val;
                    }
                }, {
                    field : "attribute1",
                    title : "明源计划楼栋ID",
                    width : 300,
                    
                    formatter : function(value) {
                        if(value){
                            var val = value+'<a href="#" rel="nofollow" class="easyui-linkbutton" style="margin-left:5px;" target="_blank">关联楼栋</a>';
                            return val;
                        }else{
                            return '<a href="#" rel="nofollow" class="easyui-linkbutton" style="margin-left:5px;" target="_blank">关联楼栋</a>';
                        }
                                            },
                    halign : 'center'
                },{
                    field : "attribute2",
                    title : "明源实际楼栋ID",
                    width : 300,
                    formatter : function(value) {
                        if(value){
                            var val = value+'<a href="#" rel="nofollow" class="easyui-linkbutton" style="margin-left:5px;" target="_blank">关联楼栋</a>';
                            return val;
                        }else{
                            return '<a href="#" rel="nofollow" class="easyui-linkbutton" style="margin-left:5px;" target="_blank">关联楼栋</a>';
                        }
                        
                    },
                    halign : 'center'
                }] ]
            });


但是在做数据行更新时,调用updataRow时,就无法更新页面显示数据,更新数据行代码如下

var index = $('#dgd_buliding_ref').datagrid('getRowIndex',$("#dgd_buliding_ref").datagrid('getSelected'));
                    $('#dgd_buliding_ref').datagrid('updateRow',{
                        index:index,
                        row: data
                    });


参考easyuiAPI也没发现有什么错误的地方,但是把index:index改成具体的数字,更新就完全没问题!!
最后无意中使者将row:data改成 row : {data:data}竟然能够更新成功
更新代码如下

var index = $('#dgd_buliding_ref').datagrid('getRowIndex',$("#dgd_buliding_ref").datagrid('getSelected'));
                    $('#dgd_buliding_ref').datagrid('updateRow',{
                        index: index,
                        row: {data:data}
                    });


总结如下:如果只是更新表格中的单个单元格,用API中给的方式是没为题的,但是如果row的数据是个行对象数据,那么久需要添加data:data格式数据

另外遇到的几个问题

问题:

1.修改后前门显示的行号发生了变化,比如原来的1编程010 等

原因:easyui的js源码问题。

解决办法:把var index = index 中的index转化成Int类型

            即: var index = parseInt(index);

            问题解决;

2.原来的行中渲染的按钮不见了

解决办法:重新渲染按钮

         $('.editCabinet').linkbutton({ text:'修改', plain:true, iconCls:'icon-edit' });

        $('.delCabinet').linkbutton({ text:'删除', plain:true, iconCls:'icon-remove' });
以上问题可能是easyui的bug造成的。

好的,今天就总结到这里了,希望对大家有帮助!


 

猜你喜欢

转载自blog.csdn.net/LYQ2332826438/article/details/86597284
今日推荐