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"> ...
随机推荐
- js面向对象(构造函数与继承)
深入解读JavaScript面向对象编程实践 Mar 9, 2016 面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式,主要包括模块化.多态.和封装几种技术. 对JavaScript而言,其 ...
- M1-S70卡片介绍
卡片有4K的存储空间,有32个小扇区和8个大扇区.小扇区的结构为:每扇区有4块,每块16个字节,一共64字节,第3块为密钥和控制字节:大扇区的结构为:每扇区16块,每块16个字节,一共256字节,第1 ...
- Osmocom-BB中cell_log的多种使用姿势
转载留做备份,原文地址:http://92ez.com/?action=show&id=23342 翻阅osmocom-bb源码的时候注意到,在cell_log中有非常多我们从来没有注意到的功 ...
- Mac可设置环境变量的位置、查看和添加PATH环境变量
Mac 启动加载文件位置(可设置环境变量) 首先要知道你使用的 Mac OS X 是什么样的 Shell,使用命令 echo $SHELL 如果输出的是:csh 或者是 tcsh,那么你用的就是 C ...
- Logwatch的配置与使用
Logwatch是使用 Perl 开发的一个日志分析工具 Logwatch能够对Linux 的日志文件进行分析,并自动发送mail给相关处理人员,可定制需求 Logwatch的mail功能是借助宿主系 ...
- HDU 4405
http://acm.hdu.edu.cn/showproblem.php?pid=4405 题意:飞行棋,可以跳,从0走到n,问期望步数 题解:dp[i]表示从i走到n的期望,逆推,因为每次都要走一 ...
- inno安装卸载时检测程序是否正在运行卸载完成后自动打开网页-代码无效
inno安装卸载时检测程序是否正在运行卸载完成后自动打开网页-代码无效 inno setup 安装卸载时检测程序是佛正在运行卸载完成后自动打开网页-代码无效 --------------------- ...
- utf8与utf-8的区别
相信很多程序员刚开始也会有这样的疑惑,如题,我也是. 其实,他们可以这样来区分. 一.在php和html中设置编码,请尽量统一写成“UTF-8”,这才是标准写法,而utf-8只是在wind ...
- C# Socket Server 收不到数据
#/usr/bin/env python # -*- coding: utf- -*- # C# Socket Server 收不到数据 # 说明: # 最近在调Python通过Socket Clie ...
- ubuntu基本配置
新系统装好后的操作: 1.resource updata:服务器镜像地址选择 2.删除不必要软件: 2.1:libreoffice sudo apt-get remove libreoffice-co ...