easyUI editdataGrid的实现

 <table id="toClientDlg" data-options="onClickCell:onClickCell,onEndEdit:onEndEdit"
                   style="height: auto;">
 </table>

需要注意的是，如果一个页面中有两个editdataGrid，那么你有可能想到的是去修改这里的onClickCell和onEndEdit函数，但是这是底层封装了的，如果要改变的话，就需要改变底层代码

    //edataGrid中的内容
    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 (editIndex != index) {
            if (endEditing()) {
                $('#dg').datagrid('selectRow', index)
                    .datagrid('beginEdit', index);
                var ed = $('#dg').datagrid('getEditor', {index: index, field: field});
                if (ed) {
                    ($(ed.target).data('numberbox') ? $(ed.target).textbox('numberbox') : $(ed.target)).focus();
                }
                editIndex = index;
            } else {
                setTimeout(function () {
                    $('#dg').datagrid('selectRow', editIndex);
                }, 0);
            }
        }
    }


    function onEndEdit(index, row) {
        var ed = $(this).datagrid('getEditor', {
            index: index,
            field: 'payment'
        });
        row.payment = $(ed.target).combobox('getText');
    }

    //新增可编辑表格中的数据
    function newData(element) {
        if (endEditing(element)) {
            $(element).datagrid('appendRow', {payment: '', foreignAmount: ''});
            editIndex = $(element).datagrid('getRows').length - 1;
            if (editIndex > 4) {
            }

            $(element).datagrid('selectRow', editIndex)
                .datagrid('beginEdit', editIndex);
        }
    }