<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>
相关推荐
在IT行业中，EasyUI Datagrid是一款基于jQuery的前端数据展示组件，它提供了丰富的表格功能，如排序、分页、过滤等。在实际工作中，我们经常需要将这些展示的数据导出到Excel文件，以便进行进一步的分析或存储。下面...
本篇文章主要讲述了如何利用jquery Easyui库中的Datagrid组件实现批量操作功能，包括编辑、删除以及添加新行。jquery Easyui 是一个基于jquery的前端UI框架，其中Datagrid组件专门用于展示和管理表格数据。通过这篇...
jquery EasyUI DataGrid 实现批量删除和批量添加和批量更新，减少服务器交互
在JQuery EasyUI datagrid中，可以对编辑器进行扩展，以实现更多自定义的编辑功能。例如，可以自定义日期时间编辑器（`datetimebox`），或者对文本编辑器添加验证规则。在扩展时，可通过`editor`属性指定编辑器类型...
本文实例讲述了jquery easyui datagrid实现增加，修改，删除的方法。分享给大家供大家参考，具体如下： 页面: <body> <form id=form1 runat=server> </form> </body> 引用的JS: &...
本篇笔记主要关注jQuery EasyUI的源码解析，特别是与数据操作相关的功能，如批量删除、表单编辑、行选择修改以及自定义编辑器方法。 ### 1. 批量删除 批量删除功能是数据管理中常见的一种操作，jQuery EasyUI提供...
总结，"easyui-datagrid-rowediting"是EasyUI Datagrid的一个强大特性，结合前端与后台的交互，实现了便捷的数据编辑和批量提交。理解和掌握这一功能，对于提升Web应用的数据处理效率和用户体验具有重要意义。
在本文中，我们将探讨如何使用jQuery Easyui的Datagrid组件实现单行的上移和下移功能，并且在操作后保存这些移动的结果。jQuery Easyui Datagrid是一个强大的数据展示工具，它提供了丰富的交互性和自定义选项，使得...
这个名为 "EasyUI_05-datagrid-src.zip" 的压缩包文件很可能包含的是EasyUI框架中关于datagrid组件的源代码和相关资源。Datagrid是EasyUI中的一个重要组件，它是一个可分页、可排序、可过滤的表格展示控件，非常适合...
其中，数据网格（DataGrid）是jQuery EasyUI中用于展示、处理和管理数据集的重要组件。本知识点将详细介绍如何利用jQuery EasyUI实现对表格的编辑功能，并且能够实现增删改操作后的一次性保存或回滚。 首先，了解...
**jQuery EasyUI eDataGrid** 是一个基于jQuery和EasyUI框架的数据网格组件，它扩展了基本的DataGrid功能，提供了更丰富的特性和交互性。EasyUI是一个轻量级的前端开发框架，它使得构建用户界面变得简单快捷。在这个...
初识Jquery EasyUI看了一些博主用其开发出来的项目，页面很炫，感觉功能挺强大，效果也挺不错，最近一直想系统学习一套前台控件，于是在网上找了一些参考示例。写了一些基本的增删改查功能，算是对该控件的基本入门...
jQuery EasyUI 是一个基于 jQuery 的前端框架，它提供了丰富的组件和便捷的API，帮助开发者快速构建出功能完备且美观的用户界面。EasyUI 的核心思想是通过简单的HTML标记和CSS样式，结合JavaScript插件，实现复杂...
### jQuery EasyUI 知识点详解 #### 一、概述 **jQuery EasyUI** 是一个基于 jQuery 的前端 UI ...通过以上内容的学习，可以全面掌握 jQuery EasyUI 的核心概念和技术要点，为开发高质量的 Web 应用奠定坚实的基础。
【SSh结合Easyui实现Datagrid的分页显示】是一个典型的Web开发应用场景，涉及到Spring、Struts2和Hibernate（SSh）三大框架与EasyUI前端组件的整合。在这个实例中，我们将探讨如何利用这些技术来实现一个具备分页...
### Jquery_EasyUI教程知识点总结 ...通过以上总结，我们可以看出Jquery_EasyUI是一个非常强大且灵活的前端开发框架，它提供了丰富的UI组件和交互功能，能够帮助开发者快速构建出功能完善的Web应用程序。
EasyUI是一种基于jQuery的前端框架，它为开发者提供了丰富的组件，包括数据表格(DataGrid)、对话框、菜单等，使得构建交互式Web应用变得更加便捷。在"EasyUI数据操作（CRUD）"这个主题中，我们将深入探讨如何利用...
3. EasyUI和Jquery在用户管理模块中的应用，例如使用EasyUI的datagrid组件来显示用户列表，使用Jquery来实现用户列表的排序和过滤功能。 4. 权限的分配和控制，例如使用EasyUI的linkbutton组件来实现权限的分配。 5....