zoukankan      html  css  js  c++  java
  • easyui datagrid 批量编辑和提交

    easyui datagrid 批量编辑和提交

    前台主要代码:

    <script type="text/javascript">
        $(function() {
            var $dg = $("#dg");
            $dg.datagrid({
                url : "servlet/list",
                width : 700,
                height : 250,
                columns : [ [ {
                    field : 'code',
                    title : 'Code',
                    width : 100,
                    editor : "validatebox"
                }, {
                    field : 'name',
                    title : 'Name',
                    width : 200,
                    editor : "validatebox"
                }, {
                    field : 'price',
                    title : 'Price',
                    width : 200,
                    align : 'right',
                    editor : "numberbox"
                } ] ],
                toolbar : [ {
                    text : "添加",
                    iconCls : "icon-add",
                    handler : function() {
                        $dg.datagrid('appendRow', {});
                        var rows = $dg.datagrid('getRows');
                        $dg.datagrid('beginEdit', rows.length - 1);
                    }
                }, {
                    text : "编辑",
                    iconCls : "icon-edit",
                    handler : function() {
                        var row = $dg.datagrid('getSelected');
                        if (row) {
                            var rowIndex = $dg.datagrid('getRowIndex', row);
                            $dg.datagrid('beginEdit', rowIndex);
                        }
                    }
                }, {
                    text : "删除",
                    iconCls : "icon-remove",
                    handler : function() {
                        var row = $dg.datagrid('getSelected');
                        if (row) {
                            var rowIndex = $dg.datagrid('getRowIndex', row);
                            $dg.datagrid('deleteRow', rowIndex);
                        }
                    }
                }, {
                    text : "结束编辑",
                    iconCls : "icon-cancel",
                    handler :endEdit
                }, {
                    text : "保存",
                    iconCls : "icon-save",
                    handler : function() {
                        endEdit();
                        if ($dg.datagrid('getChanges').length) {
                            var inserted = $dg.datagrid('getChanges', "inserted");
                            var deleted = $dg.datagrid('getChanges', "deleted");
                            var updated = $dg.datagrid('getChanges', "updated");
                            
                            var effectRow = new Object();
                            if (inserted.length) {
                                effectRow["inserted"] = JSON.stringify(inserted);
                            }
                            if (deleted.length) {
                                effectRow["deleted"] = JSON.stringify(deleted);
                            }
                            if (updated.length) {
                                effectRow["updated"] = JSON.stringify(updated);
                            }
    
                            $.post("servlet/commit", effectRow, function(rsp) {
                                if(rsp.status){
                                    $.messager.alert("提示", "提交成功!");
                                    $dg.datagrid('acceptChanges');
                                }
                            }, "JSON").error(function() {
                                $.messager.alert("提示", "提交错误了!");
                            });
                        }
                    }
                } ]
            });
            
            function endEdit(){
                var rows = $dg.datagrid('getRows');
                for ( var i = 0; i < rows.length; i++) {
                    $dg.datagrid('endEdit', i);
                }
            }
        });
    </script>
    <body>
        <table id="dg" title="批量操作"></table>
    </body>
    </html>
    

      后台commit接收类:

    //获取编辑数据 这里获取到的是json字符串
    string deleted = Request.Form["deleted"];
    string inserted = Request.Form["inserted"];
    string updated = Request.Form["updated"];
    
    if(deleted !=null){
        //把json字符串转换成对象
        List<Bean> listDeleted = JsonDeserialize<List<Bean>>(deleted);
        //TODO 下面就可以根据转换后的对象进行相应的操作了
    }
    
    if(inserted !=null){
        //把json字符串转换成对象
        List<Bean> listInserted = JsonDeserialize<List<Bean>>(inserted);
    }
    
    if(updated !=null){
        //把json字符串转换成对象
        List<Bean> listUpdated = JsonDeserialize<List<Bean>>(updated);
    }
    

      JsonDeserialize方法:

    private T JsonDeserialize<T>(string jsonString)
    {
        DataContractJsonSerializer ser = new DataContractJsonSerializer(typeof(T));
        MemoryStream ms = new MemoryStream(Encoding.UTF8.GetBytes(jsonString));
        T obj = (T)ser.ReadObject(ms);
        return obj;
    }
    

      

  • 相关阅读:
    Windows Terminal 配色方案说明
    Windows Terminal 美化简记
    家庭组网启用 NAS
    Eclipse使用Git检出项目
    SVN clean失败解决方法
    httpClient closeableHttpClient
    JSON字符串与Map互转
    httpclient用getStatusCode
    同一台电脑同时装jdk1.8和jdk1.7
    PL/SQL连接远程oracle数据库配置
  • 原文地址:https://www.cnblogs.com/wolfocme110/p/5600723.html
Copyright © 2011-2022 走看看