DataGrid( 数据表格) 组件[7]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于
Panel(面板)、Resizeable(调整大小)、LinkButton(按钮)、Pageination(分页)组件。
一. 后台交互

//删除记录
$.ajax({
type : 'POST',
url : 'delete.php',
data : {
ids : ids.join(','),
},
beforeSend : function (jqXHR, settings) {
$('#box').datagrid('loading');
},
success : function (data, textStatus, jqXHR) {
if (data) {
$('#box').datagrid('load');
$('#box').datagrid('loaded');
$('#box').datagrid('unselectAll');
$.messager.show({
title : '提示',
msg : data + '个用户被删除成功!',
});
}
},
});
//删除 PHP 代码
<?php
require 'config.php';
$ids = $_POST['ids'];
$query = mysql_query("DELETE FROM think_user WHERE id IN ($ids)")
or die('SQL 错误!');
echo mysql_affected_rows();
mysql_close();
?>
//新增及修改用户
onAfterEdit : function (rowIndex, rowData, changes) {
var inserted = $('#box').datagrid('getChanges', 'inserted');
var updated = $('#box').datagrid('getChanges', 'updated');
var url = info = '';
//新增内容
if (inserted.length > 0) {
url = 'add.php';
info = '个用户被新增成功!';
}
//修改内容
if (updated.length > 0) {
url = 'update.php';
info = '个用户被修改成功!';
}
$.ajax({
type : 'POST',
url : url,
data : {
row : rowData,
},
beforeSend : function (jqXHR, settings) {
$('#box').datagrid('loading');
},
success : function (data, textStatus, jqXHR) {
if (data) {
$('#box').datagrid('load');
$('#box').datagrid('loaded');
$('#box').datagrid('unselectAll');
$.messager.show({
title : '提示',
msg : data + info,
});
obj.editRow = undefined;
}
},
});
},
//新增服务器代码
<?php
require 'config.php';
$row = $_POST['row'][0];
$user = $row['user'];
$email = $row['email'];
$date = $row['date'];
$query = mysql_query("INSERT INTO think_user (user, email, date)
VALUES ('$user', '$email' ,'$date')") or die('SQL 错误!');
echo mysql_affected_rows();
mysql_close();
?>
//修改服务器代码
<?php
require 'config.php';
$row = $_POST['row'][0];
$id = $row['id'];
$user = $row['user'];
$email = $row['email'];
$date = $row['date'];
$query = mysql_query("UPDATE think_user SET
user='$user',email='$email',date='$date' WHERE id='$id'") or die('SQL 错
误!');
echo mysql_affected_rows();
mysql_close();
?>
DataGrid( 数据表格) 组件[7]的更多相关文章
- DataGrid( 数据表格) 组件[9]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- DataGrid( 数据表格) 组件[8]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- DataGrid( 数据表格) 组件[6]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- DataGrid( 数据表格) 组件[5]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- DataGrid( 数据表格) 组件[4]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- DataGrid( 数据表格) 组件[3]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- DataGrid( 数据表格) 组件[2]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- DataGrid( 数据表格) 组件[1]
本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于Panel(面板).Resizeable(调整大小).LinkButton(按钮).Pageination( ...
- 第二百二十二节,jQuery EasyUI,DataGrid(数据表格)组件
jQuery EasyUI,DataGrid(数据表格)组件 学习要点: 1.加载方式 2.分页功能 本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于 Pa ...
随机推荐
- display 与 visibility
项目开发中经常会遇到需要显示和隐藏DOM元素.常用的两个是display,visibility属性,高级点的会用到angularJS的ng-show,ng-if指令. W3标准对这个两个属性的解释如下 ...
- setTimeout(fn, 0)引发的JavaScipt线程的思考
起因 周五改一个checkbox的display属性被错误地设置为none的bug. 经debug发现, 有两个地方修改了display属性: 1) checkbox的controller; 2) c ...
- 移动端web页面使用position:fixed问题总结
近期完成了一个新的项目(搜狐直播),其中又涉及到了 fixed(固定位置定位)的问题,在之前的文章<移动Web产品前端开发口诀——“快”>中已经阐述过我对 iScroll 的态度,所以在这 ...
- 模块SEO优化中{分类名称}分隔符去掉及只调用下级分类方法
if($catid) { if($CAT['parentid']) { $seo_catname = ''; $tmp = strip_tags(cat_pos($CAT, 'DESTOON')); ...
- Delphi的IDHTTP的基本用法
一.IDHTTP的基本用法 IDHttp和WebBrowser一样,都可以实现抓取远端网页的功能,但是http方式更快.更节约资源,缺点是需要手动维护cook,连接等 IDHttp的创建,需要引入ID ...
- XML解析方式与解析工具
DOM解析原理: 1)JAXP (oracle-Sun公司官方) 2)JDOM工具(非官方) 3)Dom4J工具(非官方) 三大框架(默认读取xml的工具就是Dom4j) ....... SAX解析原 ...
- java-map-IdentityHashMap
1.背景 今天翻开IdentityHashMap的时候,就傻眼了,这个到底是个逻辑啊,我的程序代码如下: IdentityHashMap<String,String> identityHa ...
- GUI编程(一)-----概述
软件的交互方式 1.命令交互方式. 2.图像交互方式.Java提供了专业的API用于开发图形用户界面(GUI--> Graphic User Interface). GUI的分类 1.AW ...
- 测试Beetle.Redis+Web Api
在Web Api里用Beetle.Redis调用Redis服务端的TIME命令返回一个json格式,然后客户端是用的HttpTest4Net做的测试: CPU:I7-3770 内存:4G+4G 硬盘: ...
- Sicily connect components in undirected graph
题目介绍: 输入一个简单无向图,求出图中连通块的数目. Input 输入的第一行包含两个整数n和m,n是图的顶点数,m是边数.1<=n<=1000,0<=m<=10000. 以 ...