jquery easyui-datagrid手动增加删除重置行

1.实现的效果图如下

2.界面：

<div region="center">
        <table id="tt">
        </table>
    </div>

3.引入的js文件

<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/script/themes/default/easyui.css" />

<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/script/themes/icon.css" />

<script type="text/javascript" src="http://www.cnblogs.com/script/jquery-1.4.2.min.js" </script>

<script type="text/javascript" src="http://www.cnblogs.com/script/jquery.easyui.min.js" </script>

<script type="text/javascript" src="http://www.cnblogs.com/script/locale/easyui-lang-zh_CN.js" mce_src="script/locale/easyui-lang-zh_CN.js"></script>

4.实现的js代码：

<script type="text/javascript">
    var id;
    $(document).ready(function () { //初始化所在城区
        var dialogParams = window.dialogArguments;
        var obj  = dialogParams[0];
        var  xmaqryPartJson = obj['xmaqryPartJson'];
        $("[id^=gfzrzt_]").each(function(){
            document.getElementById($(this).attr("id")).value = obj[$(this).attr("id").replace("gfzrzt_","")]
        })
        id = obj['id'];
        initData(xmaqryPartJson)
    });
    function initData(xmaqJson) {
        if (xmaqJson == '' || xmaqJson == undefined || xmaqJson == null) {
            showTable(new Array());
        }  else {
            var data = $.parseJSON(xmaqJson);
            showTable(data);
        }
    }
    var lastIndex = undefined;
    function showTable(xmaqJson) {
        $("#tt").datagrid({
            idField: "id",
            fitColumns: false,
            title: "项目专职安全生产管理人员",
            singleSelect: true,
            frozenColumns: [[
                { field: 'id', checkbox: true }
            ]],
            columns: [
                [
                    {field: 'zrztid',  align: "center", width: 0},
                    {field: 'gcid',hidden: true, align: "center", width: 0},
                    {field: 'gccode', align: "center", width: 0},
                    {field: 'zzid',hidden: true, align: "center", width: 0},
                    {field: 'zzsj',  align: "center", width: 0},
                    {field: 'xm', title: '姓名', width: 130, sortable: true, align: 'center',required:true, editor: {type:'text'}},
                    {field: 'aqsckhzh', title: '安全生产考核证号', width: 150, sortable: true, align: 'center', editor: 'text'},
                    {field: 'lxdh', title: '联系电话', width: 100, sortable: true, align: 'center', editor: 'text'}
                ]
            ],
            toolbar: [{
                text: '添加',
                iconCls: 'icon-add',
                handler: function () {
                    if (endEditing()){
                        $('#tt').datagrid('appendRow',{row: {
                            id:'',zrztid:id,gcid:'',
                            gccode: '',
                            zzid: '',
                            zzsj: '',
                            xm:'',
                            aqsckhzh: '',
                            lxdh:''
                        }});
                        if($('#tt').datagrid('getRows') != undefined){
                            lastIndex = $('#tt').datagrid('getRows').length-1;
                        }
                        $('#tt').datagrid('selectRow', lastIndex)
                                .datagrid('beginEdit', lastIndex)
                    }
                }
            }, '-', {
                text: '删除',
                iconCls: 'icon-remove',
                handler: function () {
                    var row = $('#tt').datagrid('getSelected');
                    if (row) {
                        var index = $('#tt').datagrid('getRowIndex', row);
                        $('#tt').datagrid('cancelEdit', index).datagrid('deleteRow', index);
                        lastIndex = undefined;
                    }
                }
            }
//                ,'-', {
//                text: '保存',
//                iconCls: 'icon-save',
//                handler: function () {
//                    if (endEditing()){
//                        $('#tt').datagrid('acceptChanges');
//                    }
//                }
//            }
                , '-', {
                text: '重置',
                iconCls: 'icon-undo',
                handler: function () {
                    $('#tt').datagrid('rejectChanges');
                    lastIndex = undefined;
                }
            }]  ,
            onClickRow: function (index){
                if (lastIndex != index){
                    if (endEditing()){
                            $('#tt').datagrid('selectRow', index)
                                    .datagrid('beginEdit', index);
                            lastIndex = index;
                        } else {
                            $('#tt').datagrid('selectRow', lastIndex);
                        }
                }
            }
        });
        $("#tt").datagrid("loadData", xmaqJson);
    }

    function endEditing(){
        if (lastIndex == undefined){return true}
        if ($('#tt').datagrid('validateRow', lastIndex)){
            var ed = $('#tt').datagrid('getEditor', {index:lastIndex,field:'xm'});
            var xm = $(ed.target).val();
            var ed1 = $('#tt').datagrid('getEditor', {index:lastIndex,field:'aqsckhzh'});
            var aqsckhzh = $(ed1.target).val();
            if(xm != '' && xm != undefined && aqsckhzh !='' && aqsckhzh != undefined){
                $('#tt').datagrid('endEdit', lastIndex);
                lastIndex = undefined;
                return true;
            }else{
                alert("项目专职安全生产管理人员第"+(lastIndex+1)+"行【姓名】和【安全生产考核】必须填写");
                return false;
            }
        } else {
            return false;
        }
    }
</script>