easyui datagrid 单元格关闭编辑框再开启编辑框就报错

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui datagrid 单元格关闭编辑框再开启编辑框就报错相关的知识,希望对你有一定的参考价值。

$('#XXX).datagrid('endEdit', indexRows).datagrid('refreshRow', indexRows).datagrid('selectRow', indexRows).datagrid('beginEdit', indexRows);

执行到'beginEdit就会报$(...).datagrid(...) is null,有什么办法解决吗?

参考技术A 先不说你写的对不对吧!这个写代码的方式,刚毕业吧!
datagrid('selectRow', indexRows)应该知道他返回的对象是什么吧!你选中的那行,然后你用选中那行的对象来datagrid('beginEdit', indexRows);你觉得会对吗?!肯定要用$('#XXX).datagrid('beginEdit', indexRows);追问

也一样啊,我拆分开来写也是这样的。

也是报null的错误,更何况他们是同一个对象

追答

好吧!是我太武断了;
你用的easyui 什么版本的,为毛我的不抱错啊!
我用的是1.4.1

追问

是1.3.4版本,而且我是循环,循环第二次就产生null了

追答

是$('#XXX).datagrid('refreshRow', indexRows);这个refreshRow方法的问题(我没看过源代码,没有比对过新旧版本的区别,不是很清楚具体的原因),不过更新到新的版本,应该就没问题了;

追问

需要配合最新的jquery版本使用吗?我用了1.4.1却发现编辑框绑定不了事件

追答

官方1.4.1版的demo里面使用的jquery版本是jQuery v1.11.1

本回答被提问者采纳

EasyUI DataGrid 编辑单元格

之前文章 EasyUI DataGrid可编辑单元格 实现可编辑单元格,如果有多列都需要可编辑 当点击一个单元格 则此整行都会进行编辑

如下图:

现改为单击某个单元格只对此单元格进行可编辑

<TABLE>标记添加 onClickCell

<table id="dg" class="easyui-datagrid" data-options="onClickCell: onClickCell">


需要进行编辑的列上添加 editor

<th data-options="field:'itemId',editor:'numberbox'"></th>

也可以指定

  • 小数位数:editor:type:’numberbox’,options:precision:1

  • 文本类型:editor:’text’

  • checkbox:editor:type:’checkbox’,options:on:’启动’,off:’关闭’

效果如下:


核心代码

<script type="text/javascript">

$.extend($.fn.datagrid.methods, 
    editCell : function(jq, param) 
        return jq.each(function() 
            var opts = $(this).datagrid('options');
            var fields = $(this).datagrid('getColumnFields', true).concat(
                    $(this).datagrid('getColumnFields'));
            for ( var i = 0; i < fields.length; i++) 
                var col = $(this).datagrid('getColumnOption', fields[i]);
                col.editor1 = col.editor;
                if (fields[i] != param.field) 
                    col.editor = null;
                
            
            $(this).datagrid('beginEdit', param.index);
            for ( var i = 0; i < fields.length; i++) 
                var col = $(this).datagrid('getColumnOption', fields[i]);
                col.editor = col.editor1;
            
        );
    
);

var editIndex = undefined;
//结束编辑 
function endEditing() 
    if (editIndex == undefined) 
        return true
    
    if ($('#dg').datagrid('validateRow', editIndex)) 
        $('#dg').datagrid('endEdit', editIndex);
        editIndex = undefined;
        return true;
     else 
        return false;
    

//单击单元格 
function onClickCell(index, field) 
    if (endEditing()) 
        $('#dg').datagrid('selectRow', index).datagrid('editCell', 
            index : index,
            field : field
        );
        editIndex = index;
    

</script>

在线演示

作者:itmyhome

以上是关于easyui datagrid 单元格关闭编辑框再开启编辑框就报错的主要内容,如果未能解决你的问题,请参考以下文章

EasyUI DataGrid 编辑单元格

EasyUI datagrid editCell 编辑完单元格后如何取消编辑状态?

EasyUi DataGrid中数据编辑方式及编辑后数据获取,校验处理

easyui datagrid 编辑单元格后失去焦点结束编辑状态,怎么做啊?

easyui datagrid编辑单元格的时候失去焦点结束编辑代码怎么写

easyui datagrid 怎么默认列可编辑?