码迷,mamicode.com
首页 > 其他好文 > 详细

[转]easyui datagrid 批量编辑和提交

时间:2015-12-25 01:02:17      阅读:364      评论:0      收藏:0      [点我收藏+]

标签:

web前台主要代码:

<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接收类:

 Java版本处理

//设置请求编码
req.setCharacterEncoding("UTF-8");
//获取编辑数据 这里获取到的是json字符串
String deleted = req.getParameter("deleted");
String inserted = req.getParameter("inserted");
String updated = req.getParameter("updated");

if(deleted != null){
    //把json字符串转换成对象
    List<Bean> listDeleted = JSON.parseArray(deleted, Bean.class);
    //TODO 下面就可以根据转换后的对象进行相应的操作了
}

if(inserted != null){
    //把json字符串转换成对象
    List<Bean> listInserted = JSON.parseArray(inserted, Bean.class);
}

if(updated != null){
    //把json字符串转换成对象
    List<Bean> listUpdated = JSON.parseArray(updated, Bean.class);
}

 Bean.java

public class Bean {
    private String code;
    private String name;
    private Double price;
    public String getCode() {
        return code;
    }
    public void setCode(String code) {
        this.code = code;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public Double getPrice() {
        return price;
    }
    public void setPrice(Double price) {
        this.price = price;
    }
}

 

 PHP版本处理:

<?php

if(isset($_POST["deleted"])){
    $deleted = $_POST["deleted"];//这里获取到的是一个json数组样子字符串,eg:[{code:‘1‘,name:‘name‘,price:323},{..},....]
    $listDeleted = json_decode($deleted); //把这个json数组转化成array对象
}

if(isset($_POST["inserted"])){
    $inserted = $_POST["inserted"];
    $listInserted = json_decode($inserted);
}

if(isset($_POST["updated"])){
    $updated = $_POST["updated"];
    $listUpdated = json_decode($updated);
}

ASP.NET MVC3版本:

//获取编辑数据 这里获取到的是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;
}

里面用到的JSON.stringify,主要是把对象转换为字符串的作用。原代码在这里

注意下载这个js后,如果运行出错就去掉最后几行代码。如下删除

if (!Object.prototype.toJSONString) {
       Object.prototype.toJSONString = function (filter) {
           return JSON.stringify(this, filter);
       };
       Object.prototype.parseJSON = function (filter) {
           return JSON.parse(this, filter);
       };
   }

转:http://www.jeasyuicn.com/easyui-datagrid-batch-edit-and-submit.html

[转]easyui datagrid 批量编辑和提交

标签:

原文地址:http://www.cnblogs.com/xiangzhong/p/5074703.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!