easyUI datagrid 获取编辑状态下的值

easyUI 接触的不是很多,因此这篇文章就算记录,以后陆续遇到问题在添加。我的项目是在 angular1.x 中运用到了 easyUI 。

问题描述

easyUI datagrid 获取编辑状态下的值_第1张图片
红圈就是我正在编辑的数据

我需要编辑 dataGrid 其中的一个单元格数据,然后点击提交。这时候就遇到一个恶心的问题。我获取的 rows 里没有包含我修改的值而是初始值,只有你自己手动切换选择表格单元格的时候才能获取到修改的值(点击其它单元格,默认结束编辑)。然后自己扒拉扒拉的找了下其实最简单的用「endEdit」 属性来结束当前的编辑行。

// 语法
$('#datagrid').datagrid('endEdit', i);

因此这里提供 2 种方式吧,我验证了第一种。

问题解决

1、 最懒的方式:点击提交的时候全部结束编辑(自己验证过)

// 将 dataGrid 所有的行都结束编辑
var endRows = $('#datagrid').datagrid("getRows");
        for(var i =0; i < endRows.length; i++){
            $('#datagrid').datagrid('endEdit', i);
        }

// 获取选中的行
var rows=$('#datagrid').datagrid('getChecked');
...

// 这个时候 rows 里就能获取到你当前正在编辑 cell 的值了

2、 触发 focusout 事件

input.bind('focusout', function (e) {
    dg.datagrid('endEdit', index);
});

参考链接

  • easyUI 论坛

你可能感兴趣的:(easyUI datagrid 获取编辑状态下的值)