http://www.cnblogs.com/szytwo/archive/2012/08/29/2662169.html

前台主要代码：

<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>

后台接收主要代码：

//设置请求编码
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);
}

EASYUI datagrid批量修改与提交的更多相关文章

  1. easyui datagrid 批量编辑和提交数据

    easyui datagrid 行编辑和提交方,废话就不多说了,直接上代码 <div style="margin: 5px;"> <table id=" ...

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

    web前台主要代码: <script type="text/javascript"> $(function() { var $dg = $("#dg" ...

  3. Easyui datagrid 批量编辑和提交

    <script type="text/javascript"> $(function() { var $dg = $("#dg"); $dg.dat ...

  4. easyui datagrid动态修改editor时动态绑定combobox的数据

    需求在 datagrid 编辑框中开启一个combobox  ,但是里面的数据需要开启的时候才会知道,数据会根据其他因数变更 参考原文 :http://blog.csdn.net/donggua369 ...

  5. git批量修改已经提交的commit的姓名和邮箱

    首先,我们创建change.sh脚本,并根据个人信息复制以下脚本. #!/bin/sh git filter-branch --env-filter ' OLD_EMAIL="填写原来的邮箱 ...

  6. EasyUI DataGrid 实现单行/多行编辑功能

    要实现 EasyUI DataGrid 的可编辑很简单,在需要编辑的列添加 editor [编辑器]就可以了. 单行编辑 // 初始化数据列表 function initDatagrid() { $( ...

  7. Git批量修改提交历史

    有些时候我们可能需要批量修改提交历史,当然了,最近一次的提交历史很简单我们可以利用 git commit --amend 来进行最近一次提交的修改,如果你此时想要更新作者提交时间等也可以在amend之 ...

  8. Git 实战手册(一): 批量修改log中的提交信息

    本文须知 教程所示图片使用的是 github 仓库图片,网速过慢的朋友请移步原文地址 有空就来看看个人技术小站, 我一直都在 背景介绍 事情的起源是这样的:迷恋的谷歌的我最近申请了一个新的 googl ...

  9. EasyUI datagrid 查询、设置、提交 三

    查询 $(“#grid”).datagrid(“load”,{  a: $('#id').val(),b :$('#text').val() });   {} 里面可以 是序列化参数 $(“#grid ...

随机推荐

  1. 【bzoj4009】[HNOI2015]接水果 DFS序+树上倍增+整体二分+树状数组

    题目描述 给出一棵n个点的树,给定m条路径,每条路径有一个权值.q次询问求一个路径包含的所有给定路径中权值第k小的. 输入 第一行三个数 n和P 和Q,表示树的大小和盘子的个数和水果的个数. 接下来n ...

  2. DataBase -- Operator

    TOP子句用于规定要返回的记录的数目. SELECT TOP number | percent column_name FROM table_name LIKE操作符用于在WHERE子句中搜索列的指定 ...

  3. 运动目标前景检测之ViBe源代码分析

    一方面为了学习,一方面按照老师和项目的要求接触到了前景提取的相关知识,具体的方法有很多,帧差.背景减除(GMM.CodeBook. SOBS. SACON. VIBE. W4.多帧平均……).光流(稀 ...

  4. [poj 3281]最大流+建图很巧妙

    题目链接:http://poj.org/problem?id=3281 看了kuangbin大佬的思路,还用着kuangbin板子orz   http://www.cnblogs.com/kuangb ...

  5. inflate

    LayoutInflater是用 来找res/layout/下的xml布局文件,并且实例化 https://www.cnblogs.com/savagemorgan/p/3865831.html

  6. idea 的http client的使用

    1.打开idea的http client的工具步骤如下图所示: 然后在http client 的工具里写:请求头,请求参数,请求体即可.

  7. linux 下查看网卡工作速率

    [root@hadoop058 ~]# mii-tool eth0: negotiated 100baseTx-FD, link ok 100M linux 下查看网卡工作速率 Ethtool是用于查 ...

  8. eclipse web(Spring+SpringMVC+Hibernate)项目迁移至intellij idea

    1.导入Eclipseweb项目 跟着导航一直下一步 出现警告不要担心,先点击确认,到后面再进行设置jdk 成功导入项目后如下图 2.对导入的项目进行配置按Ctrl+shift+alt+s(或下图中的 ...

  9. gitlab之：gitlab 403 forbidden 并发引起ip被封

    步骤: * 打开/etc/gitlab/gitlab.rb文件. * 查找gitlab_rails['rack_attack_git_basic_auth']关键词. * 取消注释 * 修改ip_wh ...

  10. event loop 小记

    水平不够,只能整理一下知乎大神的回答,勉强度日这样子 在一个事件循环里,会有两个主要的队列:task queue 和 micro-task quene. 其中 task 包括: script(整体代码 ...