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 添删改(纪录)的更多相关文章

  1. Node.js、express、mongodb 入门(基于easyui datagrid增删改查)

    前言 从在本机(win8.1)环境安装相关环境到做完这个demo大概不到两周时间,刚开始只是在本机安装环境并没有敲个Demo,从周末开始断断续续的想写一个,按照惯性思维就写一个增删改查吧,一方面是体验 ...

  2. 详谈easyui datagrid增删改查操作

    转自:http://blog.csdn.net/abauch_d/article/details/7734395 前几天我把easyui dadtagrid的增删改查的实现代码贴了出来,发现访问量达到 ...

  3. asp.net mvc4 easyui datagrid 增删改查分页 导出 先上传后导入 NPOI批量导入 导出EXCEL

    效果图 数据库代码 create database CardManage use CardManage create table CardManage ( ID ,) primary key, use ...

  4. ASP.NET Easyui datagrid增删改+sqlhelper

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAjAAAAFxCAYAAABtHZI7AAAgAElEQVR4nOy9DXwU1b3//wmCYHjUPl

  5. easyui datagrid 增删改查示例

    查询JSP页面 <!doctype html> <%@include file="/internet/common.jsp"%> <!-- 新样式右侧 ...

  6. easyui datagrid 禁止选中行 EF的增删改查(转载) C# 获取用户IP地址(转载) MVC EF 执行SQL语句(转载) 在EF中执行SQL语句(转载) EF中使用SQL语句或存储过程 .net MVC使用Session验证用户登录 PowerDesigner 参照完整性约束(转载)

    easyui datagrid 禁止选中行   没有找到可以直接禁止的属性,但是找到两个间接禁止的方式. 方式一: //onClickRow: function (rowIndex, rowData) ...

  7. easyui datagrid中datetime字段的显示和增删改查问题

    datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借 ...

  8. golang学习之beego框架配合easyui实现增删改查及图片上传

    golang学习之beego框架配合easyui实现增删改查及图片上传 demo目录: upload文件夹主要放置上传的头像文件,main是主文件,所有效果如下: 主页面: 具体代码: <!DO ...

  9. 反射实体自动生成EasyUi DataGrid模板

    用EasyUi Datagrid展示数据的时候总是要一下这样一段代码 <table id="dt" class="easyui-datagrid"> ...

随机推荐

  1. PHP+MySql字符问题原理分析

    假如数据库已经设置了utf-8 ,php文件也设置了utf-8 ,但在php文件的查询语句中未添加了 mysql_query("set names utf8")语句,此时php页面 ...

  2. Java Inner class && nested class

    Java中,Inner Class(不被 static修饰)可以访问outer class 的所有成员(包括私有成员),同时,内部类 的创建必须经由外部类的实例! nested class 有stat ...

  3. 极客DIY:RFID飞贼打造一款远距离渗透利器

    本文使用最新的渗透工具RFID飞贼(Tastic RFID Thief)和RFID感应破解技术来获取一些拥有安防的建筑物的访问权限. Tastic RFID Thief是一个无声远距离RFID读卡器, ...

  4. 极客DIY:打造属于自己的无线移动渗透测试箱

    本文中介绍的工具.技术带有一定的攻击性,请合理合法使用. 你想不想拥有一款属于自己的移动无线渗透测试箱,如果你感兴趣,下面介绍的设备将会对你很有帮助.这个箱子被称为“MiTM(中间人攻击)WiFi箱” ...

  5. php大力力 [003节]php在百度文库的几个基础教程mac环境下文本编辑工具

    2015-08-22 php大力力003.mac环境下文本编辑工具 在windows下,使用notepad特别多.在mac下使用“备忘录”app,word,反而没有存储过txt后缀等不同文本. mac ...

  6. scp 在Ubuntu下传文件 基于ssh

    scp是linux下的远程拷贝 命令: (1)将本地文件拷贝到远程:scp  文件名 用户名@计算机IP或者计算机名称:远程路径  (2)从远程将文件拷回本地:scp  用户名@计算机IP或者计算机名 ...

  7. CF700C (枚举+tarjan)

    Problem Break up (CF700C) 题目大意 给一张n个点,m条边的无向图,有边权,和起点S,终点T. (n<=1000 , m<=30000) 要求最多割掉2条边,使得S ...

  8. PAT (Basic Level) Practise:1013. 数素数

    [题目连接] 令Pi表示第i个素数.现任给两个正整数M <= N <= 104,请输出PM到PN的所有素数. 输入格式: 输入在一行中给出M和N,其间以空格分隔. 输出格式: 输出从PM到 ...

  9. MVC&WebForm对照学习:文件上传(以图片为例)

    原文  http://www.tuicool.com/articles/myM7fe 主题 HTMLMVC模式Asp.net 博客园::首页::  ::  ::  ::管理 5 Posts :: 0 ...

  10. UpdatePanel与$.function()同时使用问题

    在.NET中使用了UpdatePanel,里面的输入框使用了jQuery的日历选择器,接下来介绍下两者同时使用的一些细节及问题的解决方法,感兴趣的各位可以参考下哈 今天,在.NET中使用了Update ...