easyui datagrid 添删改(纪录)
var groups;//用户组为另一个表,所以需先加载,用于编辑时下拉框
var editindex = undefined;
var action;
$(function () {
$.ajax({
cache: false,
async: false,
type: "POST",
dataType: 'json',
url: "/Areas/Manager/Handler/WebStat/AdminList.ashx?classa=grouplist",
success: function (data) {
groups = data;//加载用户组json
}
});
list();
});
function list() {
$("#AdminList").datagrid({
width: 800,
height: 760,
title: '管理员列表',
url: '/Areas/Manager/Handler/WebStat/AdminList.ashx?classa=list',
singleSelect: true,
pagination: true,
pageSize: 30,
pageList: [30, 50, 100],
idField: "id",
columns: [[
{ title: '编号', field: 'id', width: 40 },
{ title: '用户名', field: 'name', width: 150, editor: { type: 'validatebox',
options: { required: true, missingMessage: '不能为空' }//验证编辑框
}
},
{ title: '用户组', field: 'gid', width: 300, formatter: function (value) {
for (var i = 0; i < groups.length; i++) {
if (groups[i].gid == value) return groups[i].groupname;
}
return value;//用户组为另一个表,加载为用户组表的id,需格式化显示用户组名
}, editor: { type: 'combobox', options: { valueField: 'gid',
textField: 'groupname',
data: groups//编辑时用户组下拉框
}
}
},
{ title: '日期', field: 'data', width: 160 },
{ title: '操作', field: 'action', width: 140,
formatter: function (value, row, index) {
if (row.editing) {
var s = '<a href="#" onclick="saverow(this)">Save</a> ';
var c = '<a href="#" onclick="cancelrow(this)">Cancel</a>';
return s + c;
} else {
var e = '<a href="#" onclick="editrow(this)">Edit</a> ';
var d = '<a href="#" onclick="deleterow(this)">Delete</a>';
return e + d;
}
}
}
]],
toolbar: [{
text: '增加',
iconCls: 'icon-add',
handler: function () {
insert();
}
}],
onBeforeEdit: function (index, row) {
row.editing = true;
updateActions(index);
},
onAfterEdit: function (index, row) {
row.editing = false;
updateActions(index);
},
onCancelEdit: function (index, row) {
row.editing = false;
updateActions(index);
}
});
var pager = $('#AdminList').datagrid('getPager'); // 分页
}
function updateActions(index) {//只允许一行编辑
if (endEditing()) {
$("#AdminList").datagrid('selectRow', index);
$('#AdminList').datagrid('updateRow', {
index: index,
row: {}
});
editindex = index;
} else {
$('#AdminList').datagrid('selectRow', editindex);
}
}
function endEditing() {
if (editindex == undefined) { return true; }
if ($('#AdminList').datagrid('validateRow', editindex)) {
$('#AdminList').datagrid('endEdit', editindex);
editindex = undefined; return true;
} else { return false; }
}
function getRowIndex(target) {
var tr = $(target).closest('tr.datagrid-row');
return parseInt(tr.attr('datagrid-row-index'));
}
function editrow(target) {
action = "Edit";
$('#AdminList').datagrid('beginEdit', getRowIndex(target));
}
function deleterow(target) {
$.messager.confirm('Confirm', 'Are you sure?', function (r) {
if (r) {
var row = $('#AdminList').datagrid('getSelected');
if (row) {
$.ajax({
cache: false,
async: false,
type: "POST",
dataType: 'json',
url: "/Areas/Manager/Handler/WebStat/AdminList.ashx?classa=Del&id=" + row.id + "",
success: function (data) {
if (data > 0) {
$('#AdminList').datagrid('reload');
}
else {
$.messager.alert('Warning', '保存错误!');
}
}
});
}
$('#AdminList').datagrid('deleteRow', getRowIndex(target));
}
});
}
function saverow(target) {
$('#AdminList').datagrid('endEdit', getRowIndex(target));
var row = $('#AdminList').datagrid('getSelected');
if (row) {
$.ajax({
cache: false,
async: false,
type: "POST",
dataType: 'json',
url: "/Areas/Manager/Handler/WebStat/AdminList.ashx?classa=" + action + "&id=" + row.id + "&name=" + row.name + "&gid=" + row.gid,
success: function (data) {
if (data > 0) {
$('#AdminList').datagrid('reload');
}
else {
$.messager.alert('Warning', '保存错误!');
}
}
});
}
}
function cancelrow(target) {
$('#AdminList').datagrid('cancelEdit', getRowIndex(target));
}
function insert() {
if (endEditing()) {
// var row = $('#AdminList').datagrid('getSelected');
// if (row) {
// var index = $('#tt').datagrid('getRowIndex', row);
// } else {
index = 0;//添加新内容,只插入到第一行
// }
$('#AdminList').datagrid('insertRow', {
index: index,
row: {
status: 'P'
}
});
action = "Add";
$('#AdminList').datagrid('selectRow', index);
$('#AdminList').datagrid('beginEdit', index);
editindex = undefined;
}
}
由 http://www.jeasyui.com/tutorial/datagrid/datagrid12.php 修改
easyui datagrid 添删改(纪录)的更多相关文章
- Node.js、express、mongodb 入门(基于easyui datagrid增删改查)
前言 从在本机(win8.1)环境安装相关环境到做完这个demo大概不到两周时间,刚开始只是在本机安装环境并没有敲个Demo,从周末开始断断续续的想写一个,按照惯性思维就写一个增删改查吧,一方面是体验 ...
- 详谈easyui datagrid增删改查操作
转自:http://blog.csdn.net/abauch_d/article/details/7734395 前几天我把easyui dadtagrid的增删改查的实现代码贴了出来,发现访问量达到 ...
- asp.net mvc4 easyui datagrid 增删改查分页 导出 先上传后导入 NPOI批量导入 导出EXCEL
效果图 数据库代码 create database CardManage use CardManage create table CardManage ( ID ,) primary key, use ...
- ASP.NET Easyui datagrid增删改+sqlhelper
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAjAAAAFxCAYAAABtHZI7AAAgAElEQVR4nOy9DXwU1b3//wmCYHjUPl
- easyui datagrid 增删改查示例
查询JSP页面 <!doctype html> <%@include file="/internet/common.jsp"%> <!-- 新样式右侧 ...
- easyui datagrid 禁止选中行 EF的增删改查(转载) C# 获取用户IP地址(转载) MVC EF 执行SQL语句(转载) 在EF中执行SQL语句(转载) EF中使用SQL语句或存储过程 .net MVC使用Session验证用户登录 PowerDesigner 参照完整性约束(转载)
easyui datagrid 禁止选中行 没有找到可以直接禁止的属性,但是找到两个间接禁止的方式. 方式一: //onClickRow: function (rowIndex, rowData) ...
- easyui datagrid中datetime字段的显示和增删改查问题
datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借 ...
- golang学习之beego框架配合easyui实现增删改查及图片上传
golang学习之beego框架配合easyui实现增删改查及图片上传 demo目录: upload文件夹主要放置上传的头像文件,main是主文件,所有效果如下: 主页面: 具体代码: <!DO ...
- 反射实体自动生成EasyUi DataGrid模板
用EasyUi Datagrid展示数据的时候总是要一下这样一段代码 <table id="dt" class="easyui-datagrid"> ...
随机推荐
- 如何实现标准TCODE的屏幕增强
如何实现标准TCODE的屏幕增强(HOWTO:Implement a screen exit to a standard SAP transaction) Introduction SAP provi ...
- struts2中form提交到action中的中文参数乱码问题解决办法(包括取中文路径)
我的前台页是这样的: <body> <form action="test.action" method="post"> ...
- CGI标准简介 ~ Django
CGI CGI(Common Gateway Interface)是WWW技术中最重要的技术之一 , 有着不可替代的重要地位 , CGI是外部应用程序(CGI程序)于Web服务器之间的接口标准 , 实 ...
- HTTP Live Streaming直播(iOS直播)技术分析与实现
前些日子,也是项目需要,花了一些时间研究了HTTP Live Streaming(HLS)技术,并实现了一个HLS编码器HLSLiveEncoder,当然,C++写的.其功能是采集摄像头与麦克风,实时 ...
- esayui-datagrid的使用
第一步:在页面上引入easyui的jQuery链接 <script src="../../Scripts/easyUI/jquery-1.7.2.min.js" type=& ...
- AssemblyInfo.cs的作用
总结:用来设置项目生成的dll的常规信息.(如版本.版权等等)它就相当于一个资源文件,存放资源信息. http://www.cnblogs.com/xuyuantao/articles/927285. ...
- interproscan 的使用和遇到的问题
错误一: 2014-10-08 13:09:32,238 [uk.ac.ebi.interpro.scan.jms.worker.LocalJobQueueListener:193] ERROR - ...
- GFF format
后记: ************************************************************************ 在使用cufflinks和cuffmerge中 ...
- TCP/IP 协议大致的概念
最近在看<图解HTTP>和<HTTP权威指南>,对TCP/IP大致过了一下. TCP/IP 不仅仅是TCP 和 IP TCP/IP 是协议族,与之相对的事IEEE等标准组织设 ...
- hdu 2337 Escape from Enemy Territory
题目大意 给你一张nn*mm矩形地图.上面有些点上有敌营.给你起点和终点, 你找出一条最优路径.满足最优路径上的点离敌营的最近最短距离是所有路径最短的.若有多条找路径最短的一条. 分析 通过二分来确定 ...