前臺主要代碼：
001 <script type="text/javascript">
002 $(function() {
003 var $dg = $("#dg");
004 $dg.datagrid({
005 url : "servlet/list",
006 width : 700,
007 height : 250,
008 columns : [ [ {
009 field : 'code',
010 title : 'Code',
011 width : 100,
012 editor : "validatebox"
013 }, {
014 field : 'name',
015 title : 'Name',
016 width : 200,
017 editor : "validatebox"
018 }, {
019 field : 'price',
020 title : 'Price',
021 width : 200,
022 align : 'right',
023 editor : "numberbox"
024 } ] ],
025 toolbar : [ {
026 text : "添加",
027 iconCls : "icon-add",
028 handler : function() {
029 $dg.datagrid('appendRow', {});
030 var rows = $dg.datagrid('getRows');
031 $dg.datagrid('beginEdit', rows.length - 1);
032 }
033 }, {
034 text : "編輯",
035 iconCls : "icon-edit",
036 handler : function() {
037 var row = $dg.datagrid('getSelected');
038 if (row) {
039 var rowIndex = $dg.datagrid('getRowIndex', row);
040 $dg.datagrid('beginEdit', rowIndex);
041 }
042 }
043 }, {
044 text : "刪除",
045 iconCls : "icon-remove",
046 handler : function() {
047 var row = $dg.datagrid('getSelected');
048 if (row) {
049 var rowIndex = $dg.datagrid('getRowIndex', row);
050 $dg.datagrid('deleteRow', rowIndex);
051 }
052 }
053 }, {
054 text : "結束編輯",
055 iconCls : "icon-cancel",
056 handler :endEdit
057 }, {
058 text : "保存",
059 iconCls : "icon-save",
060 handler : function() {
061 endEdit();
062 if ($dg.datagrid('getChanges').length) {
063 var inserted = $dg.datagrid('getChanges', "inserted");
064 var deleted = $dg.datagrid('getChanges', "deleted");
065 var updated = $dg.datagrid('getChanges', "updated");
066
067 var effectRow = new Object();
068 if (inserted.length) {
069 effectRow["inserted"] = JSON.stringify(inserted);
070 }
071 if (deleted.length) {
072 effectRow["deleted"] = JSON.stringify(deleted);
073 }
074 if (updated.length) {
075 effectRow["updated"] = JSON.stringify(updated);
076 }
077
078 $.post("servlet/commit", effectRow, function(rsp) {
079 if(rsp.status){
080 $.messager.alert("提示", "提交成功！");
081 $dg.datagrid('acceptChanges');
082 }
083 }, "JSON").error(function() {
084 $.messager.alert("提示", "提交錯誤了！");
085 });
086 }
087 }
088 } ]
089 });
090
091 function endEdit(){
092 var rows = $dg.datagrid('getRows');
093 for ( var i = 0; i < rows.length; i++) {
094 $dg.datagrid('endEdit', i);
095 }
096 }
097 });
098 </script>
099 <body>
100 <table id="dg" title="批量操作"></table>
101 </body>
102 </html>
後臺commit接收類：
Java版本處理
01 //設置請求編碼
02 req.setCharacterEncoding("UTF-8");
03 //獲取編輯數據 這裏獲取到的是json字符串
04 String deleted = req.getParameter("deleted");
05 String inserted = req.getParameter("inserted");
06 String updated = req.getParameter("updated");
07
08 if(deleted != null){
09 //把json字符串轉換成對象
10 List<Bean> listDeleted = JSON.parseArray(deleted, Bean.class);
11 //TODO 下面就可以根據轉換後的對象進行相應的操作了
12 }
13
14 if(inserted != null){
15 //把json字符串轉換成對象
16 List<Bean> listInserted = JSON.parseArray(inserted, Bean.class);
17 }
18
19 if(updated != null){
20 //把json字符串轉換成對象
21 List<Bean> listUpdated = JSON.parseArray(updated, Bean.class);
22 }
Bean.java
01 public class Bean {
02 private String code;
03 private String name;
04 private Double price;
05 public String getCode() {
06 return code;
07 }
08 public void setCode(String code) {
09 this.code = code;
10 }
11 public String getName() {
12 return name;
13 }
14 public void setName(String name) {
15 this.name = name;
16 }
17 public Double getPrice() {
18 return price;
19 }
20 public void setPrice(Double price) {
21 this.price = price;
22 }
23 }
?