Easyui datagrid绑定数据,新增,修改,删除写法

@{
    ViewBag.Title = "xw_xsfl";
}
<script type="text/javascript">
    var editIndex = undefined;
    var pxsdata;
    $(function () {
        GetList();
    })
    function GetList() {
        $('#dg').datagrid({
            width: 'auto',
            height: 'auto',
            scrollbarSize: 0,
            url: 'xw_xsfl_list',
            loadMsg: '正在加载....',
            columns: [[
                { field: 'ck', title: '', width: 100, sortable: true, checkbox: true },
                { field: 'id', title: 'id', width: 60, sortable: true,hidden: true },
                { field: 'xsfl', title: '学生分类码', width: 60, sortable: true,
                    editor: { type: 'textbox', options: { required: true} }
                },
                { field: 'xsflmc', title: '学生分类名称', width: 150, sortable: true,
                    editor: { type: 'textbox', options: { required: true} }
                },
                { field: 'action', title: '操作', width: 100, align: 'center',
                    formatter: function (value, row, index) {
                        if (row.status == 'add') {
                            var c = '<a class="l-btn l-btn-small l-btn-plain" href="javascript:void(0)" onclick=saverow(this,"add")><span class="l-btn-left l-btn-icon-left"><span class="l-btn-text">新增</span><span class="l-btn-icon icon-add">&nbsp;</span></span></a> ';
                            return c;
                        }
                        if (row.editing) {
                            var a = '<a class="l-btn l-btn-small l-btn-plain" href="javascript:void(0)" onclick=saverow(this,"edit")><span class="l-btn-left l-btn-icon-left"><span class="l-btn-text">保存</span><span class="l-btn-icon icon-save">&nbsp;</span></span></a> ';
                            var b = '<a class="l-btn l-btn-small l-btn-plain" href="javascript:void(0)" onclick="cancelrow(this)"><span class="l-btn-left l-btn-icon-left"><span class="l-btn-text">取消</span><span class="l-btn-icon icon-undo">&nbsp;</span></span></a> ';
                            return a + b;
                        } else {
                            var e = '<a class="l-btn l-btn-small l-btn-plain" href="javascript:void(0)" onclick="editrow(this)"><span class="l-btn-left l-btn-icon-left"><span class="l-btn-text">编辑</span><span class="l-btn-icon icon-edit">&nbsp;</span></span></a> ';
                            return e;
                        }
                    }
                }
            ]],

            fitColumns: true,
            striped: true,
            rownumbers: true, //行号
            singleSelect: false, //是否单选 
            onLoadSuccess: function (data) {
                $('#dg').datagrid('appendRow', { status: 'add' });
                var addIndex = $('#dg').datagrid('getRows').length - 1;
                $('#dg').datagrid('beginEdit', addIndex);
            },
            onBeforeEdit: function (index, row) {
                row.editing = true;
                $('#dg').datagrid('refreshRow', index);
            },
            onAfterEdit: function (index, row) {
                row.editing = false;
                $('#dg').datagrid('refreshRow', index);
            },
            onCancelEdit: function (index, row) {
                row.editing = false;
                $('#dg').datagrid('refreshRow', index);
            }
        });
    }
    function tool_del() {
        var rows = $('#dg').datagrid("getSelections");
        if (rows.length > 0) {
            $.messager.confirm("提示", "你确定要删除吗?", function (r) {
                if (r) {
                    var ids = [];
                    for (var i = 0; i < rows.length; i++) {
                        ids.push(rows[i].id);
                    }
                    var xsfls = ids.join(",");
                    $.ajax({
                        type: 'post',
                        dataType: "json", //返回json格式的数据
                        url: "../xwsb/xw_xsfl_xsflDel",
                        data: { 'xsfls': xsfls },
                        cache: false,
                        success: function (Data) {
                            if (Data == "1") {
                                $('#dg').datagrid("reload", {});
                                $.messager.alert("提示", "删除成功");
                            }
                            else {
                                $.messager.alert("提示", "删除失败", "error");
                            }
                        },
                        error: function (e) {
                            var msg = responseTextTitle(e.responseText);
                            $.messager.alert("提示", msg, "error");
                        }
                    });
                }
            });
        }
        else {
            $.messager.alert("提示", "请选择要删除的行", "error");
        }
        
    }

    function editrow(target) {
        var thisindex = getRowIndex(target);
        if (editIndex == undefined) {
            $('#dg').datagrid('beginEdit', thisindex);
            editIndex = thisindex;
            var input = $('#dg').datagrid('getEditor', { index: thisindex, field: 'xsfl' }).target;
            $(input).textbox("disable");
        }
    }

    function saverow(obj, savetype) {
        var editRow = getRowIndex(obj);
        var req = new Object();
        req.type = savetype;
        var xsfl = $('#dg').datagrid('getEditor', { index: editRow, field: 'xsfl' });
        var xsflmc = $('#dg').datagrid('getEditor', { index: editRow, field: 'xsflmc' });
        req.xsfl = $(xsfl.target)[0].value;
        req.xsflmc = $(xsflmc.target)[0].value;
        if (savetype == "edit") {
            var row = $('#dg').datagrid('getRows')[editRow];
            if (row && row.id != "") {
                req.id = row.id;
             }
            
         }
        var jsonObject = JSON.stringify(req);
        $.ajax({
            type: 'post',
            url: "../xwsb/xw_xsfl_xsflEdit",
            data: { 'type': req.type, 'json': jsonObject },
            cache: false,
            success: function (Data) {
                if (Data == "1") {
                    $('#dg').datagrid("reload");
                    editIndex = undefined;

                }
                else {
                    $.messager.alert("提示", "保存失败:" + Data, "error");
                }
            },
            error: function (e) {
                var msg = responseTextTitle(e.responseText);
                $.messager.alert("提示", msg, "error");
            }
        });
    }

    function cancelrow(target) {
        index = getRowIndex(target);
        $('#dg').datagrid('cancelEdit', index);
        editIndex = undefined;
    }

    function getRowIndex(target) {
        var tr = $(target).closest('tr.datagrid-row');
        return parseInt(tr.attr('datagrid-row-index'));
    }
</script>
<div class="tools-row">
    @*<a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-remove" onclick="tool_del()" >删除</a>*@
    <table cellpadding="0" cellspacing="0" style="width:100%">
        <tr>
            <td align="right">
                    <button id="btndel" type="button" class="but-primary " onclick="tool_del()"><span class="icon icon-delete"></span>删除</button>
            </td>
        </tr>
    </table>
</div>
<table id="dg">
</table>

 

posted @ 2018-08-17 14:53  Ajoying  阅读(351)  评论(0编辑  收藏  举报