jqgrid 增删改页面快速构建
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="InvitationRouteManage.aspx.cs" Inherits="OilDigital.CGGL.InvitationApproval.Web.InvitationRouteManage" %> <!DOCTYPE html>
<link href="../css/jquery-ui.css" rel="stylesheet" />
<link href="../css/ui.jqgrid.css" rel="stylesheet" />
<script src="../js/jquery.min.js"></script>
<script src="../js/jquery-ui.js"></script>
<script src="../js/jquery.jqGrid.min.js"></script>
<script src="../js/GridHelper.js"></script>
<script src="../js/grid.locale-cn.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
var columns = ["Id", "停留城市", "停留天数"];
var localData = [];
var gridHelper = new jqGridHelper(); jQuery(document).ready(function () { initGrid();
doQuery();
$j("input").focus(function () {
$j("#error_msg").css("display", "none");
$j("#error_msg1").css("display", "none");
});
});
function initGrid() {
localGrid = jQuery("#tbList");
localGrid.jqGrid({
data: localData,
datatype: "local",
height: ,
width: ,
autowidth: true,
rowNum: ,
colNames: columns,
colModel: [
{ name: 'Id', key: true, index: 'Id', hidden: true, width: },
{ name: 'City', index: 'City', width: , align: "center" },
{ name: 'Stayday', index: 'Stayday', width: , align: "center" }
],
emptyrecords: "没有任何数据",
pager: "#pager",
viewrecords: true,
rownumbers: true,
shrikToFit: true,
loadonce: true,
caption: "访问路线"
}).navGrid('#pager', { search: true, edit: false, add: false, del: false, searchtext: "搜索" }); gridHelper.SetAutoResize(localGrid, -, -, true, true);
} function doQuery() {
var id = invitationId;
OilDigital.CGGL.InvitationApproval.Web.InvitationRouteManage.GetInvitationRouteByInvitationId(parseInt(id), queryCallback_Local);
}
function queryCallback_Local(rep) {
try {
if (rep.error != null) {
alert(rep.error.Message);
return;
}
localData = rep.value;
gridHelper.refreshGrid(localGrid, localData);
}
catch (e) {
return;
}
}
function addRoute()
{
$j("#add_City").val("");
$j("#add_Stayday").val("");
$j("#addRoute").css("display","block");
$j("#addRoute").dialog({
modal:true,
width: ,
height: ,
title: "增加来华路线信息",
buttons:{
"确定": function () {
var id = invitationId;
var city = $j("#add_City").val();
var stayday = $j("#add_Stayday").val();
if (city == "" || city== null)
{
$j("#error_msg").show();
$j("#error_msg").html("城市名不能为空！");
return;
}
var reg = /^[-]\d*$/;
if (!reg.test(stayday)) {
$j("#error_msg").css("display", "block");
$j("#error_msg").html("停留天数只能输入正整数！");
return;
}
var rep = OilDigital.CGGL.InvitationApproval.Web.InvitationRouteManage.AddInvitationRoute(id, city, stayday);
if (rep.error != null) {
$j("#error_msg").css("display", "block");
$j("#error_msg").html("添加来华路线信息出错，原因：" + rep.error.Message);
return;
} else {
$j(this).dialog("close");
alert("新增成功！");
doQuery();
}
},
"取消": function ()
{
$j(this).dialog("close");
}
}
});
}
function editRoute()
{
var selRowId = localGrid.jqGrid('getGridParam', 'selrow');
if (selRowId == null) {
alert("请选择一行然后进行操作");
return;
}
var rep = OilDigital.CGGL.InvitationApproval.Web.InvitationRouteManage.GetInvitationRouteById(selRowId);
if (rep.error != null)
{
alert(rep.error.Message);
return;
}
$j("#edit_City").val(rep.value.City);
$j("#edit_Stayday").val(rep.value.Stayday);
$j("#editRoute").css("display", "block");
$j("#editRoute").dialog({
modal: true,
width: ,
height: ,
title: "编辑来华线信息",
buttons: {
"确定": function () {
var city = $j("#edit_City").val();
var stayday = $j("#edit_Stayday").val();
if (city == ""||city==null) {
$j("#error_msg1").css("display", "block");
$j("#error_msg1").html("城市不能为空！");
return;
}
var reg = /^[-]\d*$/;
if (!reg.test(stayday)) {
$j("#error_msg1").css("display","block");
$j("#error_msg1").html("停留天数只能输入正整数！");
return;
}
var rep = OilDigital.CGGL.InvitationApproval.Web.InvitationRouteManage.EditInvitationRoute(selRowId, city, stayday);
if (rep.error != null) {
$j("#error_msg1").css("display", "block");
$j("#error_msg1").html("编辑来华路线信息出错，原因：" + rep.error.Message);
return;
} else {
$j(this).dialog("close");
alert("修改成功！");
doQuery();
}
},
"取消": function () {
$j(this).dialog("close");
}
}
});
}
function deleteRoute()
{
var selRowId = localGrid.jqGrid('getGridParam', 'selrow');
if (selRowId == null) {
alert("请选择一行然后进行操作");
return;
}
if (!confirm("确定要删除选中的记录吗？")) return;
var rep = OilDigital.CGGL.InvitationApproval.Web.InvitationRouteManage.DeleteRouteById(selRowId);
if (rep.error != null)
{
alert("删除数据出错，原因:" + rep.error.Message);
return;
}
doQuery();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:HiddenField ID="hfEaId" runat="server" />
<div>
<div class="Titleblueback4" style="padding-top:15px; color:#039; font-size:15pt;font-weight:bold;text-align:center">来 华 路 线 编 辑</div>
<div>
<input type="button" id="edit" value="修 改" onclick="editRoute();" />
<input type="button" id="add" value="新 增" onclick="addRoute();" />
<input type="button" id="delete" value="删 除" onclick="deleteRoute();" />
</div>
<div>
<table id="tbList"></table>
<div id="pager"></div>
</div>
</div> <!--新增-->
<div id="addRoute" style="display:none"> <table>
<tbody>
<tr>
<td><label>城市：</label></td>
<td><input type="text" id="add_City"/></td>
</tr>
<tr>
<td><label>停留天数：</label></td>
<td><input type="text" id="add_Stayday"/></td>
</tr>
</tbody>
</table>
<span style="display:none;color:red" id="error_msg"></span>
</div>
<!--修改-->
<div id="editRoute" style="display:none">
<input type="hidden" id="hfId" />
<table>
<tbody>
<tr>
<td><label>城市：</label></td>
<td><input type="text" id="edit_City"/></td>
</tr>
<tr>
<td><label>停留天数：</label></td>
<td><input type="text" id="edit_Stayday"/></td>
</tr>
</tbody>
</table>
<span style="display:none;color:red" id="error_msg1"></span> </div>
</form>
</body>
</html>
jqgrid 增删改页面快速构建的更多相关文章
- 【ASP.NET MVC】jqGrid 增删改查详解
1 概述 本篇文章主要是关于JqGrid的,主要功能包括使用JqGrid增删查改,导入导出,废话不多说,直接进入正题. 2 Demo相关 2.1 Demo展示 第一部分 第二部分 2.2 ...
- stark——增删改页面
一.制作添加页面 1.前置准备 (1)修改增删改的视图函数名 class ModelStark(object): def add_view(self, request): return HttpRes ...
- JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案（四）：自定义T4模板快速生成页面
前言:上篇介绍了下ko增删改查的封装,确实节省了大量的js代码.博主是一个喜欢偷懒的人,总觉得这些基础的增删改查效果能不能通过一个什么工具直接生成页面效果,啥代码都不用写了,那该多爽.于是研究了下T4 ...
- 【转载】salesforce 零基础开发入门学习（六）简单的数据增删改查页面的构建
salesforce 零基础开发入门学习(六)简单的数据增删改查页面的构建 VisualForce封装了很多的标签用来进行页面设计,本篇主要讲述简单的页面增删改查.使用的内容和设计到前台页面使用的 ...
- salesforce 零基础开发入门学习（六）简单的数据增删改查页面的构建
VisualForce封装了很多的标签用来进行页面设计,本篇主要讲述简单的页面增删改查.使用的内容和设计到前台页面使用的标签相对简单,如果需要深入了解VF相关知识以及标签, 可以通过以下链接查看或下载 ...
- C# Winform 通过FlowLayoutPanel及自定义的编辑控件，实现快速构建C/S版的编辑表单页面
个人理解,开发应用程序的目的,不论是B/S或是C/S结构类型,无非就是实现可供用户进行查.增.改.删,其中查询用到最多,开发设计的场景也最为复杂,包括但不限于:表格记录查询.报表查询.导出文件查询等等 ...
- 快速入门GreenDao框架并实现增删改查案例
大家的项目中不可避免的使用到SQLite,为此我们要花费心思编写一个增删改查框架.而一个好的ORM框架则能够给我们带来极大的方便,今天给大家讲解一个非常火热的ORM-GreenDao. 基本概念 Gr ...
- Winform 通过FlowLayoutPanel及自定义的编辑控件，实现快速构建C/S版的编辑表单页面 z
http://www.cnblogs.com/zuowj/p/4504130.html 不论是B/S或是C/S结构类型,无非就是实现可供用户进行查.增.改.删,其中查询用到最多,开发设计的场景 也最为 ...
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（5）-EF增删改查by糟糕的代码
原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(5)-EF增删改查by糟糕的代码 上一讲我们创建了一系列的解决方案,我们通过一个例子来看看层与层之间的关系 ...
随机推荐
- mysql 复制（主从复制）
一.概述 让一台服务器的数据与其他服务器数据保持同步.一台主库的数据可以同步到多台备库上,而备库本身也可以配置成其他服务器的主库. 主要应用: 1) 数据分布 2) 负载均衡 3) 伪备份.在备份基础 ...
- 钩子(hook)编程
一.钩子介绍 1.1钩子的实现机制 钩子英文名叫Hook,是一种截获windows系统中某应用程序或者所有进程的消息的一种技术.下图是windows应用程序传递消息的过程: 如在键盘中按下一键,操作系 ...
- nginx理解与配置
准备: http服务器:①tomcat②apache③nginx(c语言开发) 文件系统:①mgfs ②mgbd:存储小文件 ③fastDFS:存储大文件.小文件,分布式文件系统 nginx是一种ht ...
- ASP.NET -- 获取浏览器信息
1. 获取浏览器信息 private void GetBrowserInfo() { StringBuilder sb = new StringBuilder(); sb.AppendLine(str ...
- JVM之类加载机制
JVM之类加载机制 JVM类加载机制分为五个部分:加载,验证,准备,解析,初始化,下面我们就分别来看一下这五个过程. 类加载五部分 加载 加载是类加载过程中的一个阶段,这个阶段会在内存中生成一个代表这 ...
- Jmeter_使用IE代理录制脚本
因为项目登录的密码需要RSA加密,选用了jmeter作为压测工具: 就自己本次项目,顺便学习Jmeter,做一个简单的记录,本文主要介绍使用IE代理录制脚本: 自己也尝试过使用Badboy录制,还是喜 ...
- Android Gradle 隐形依赖的奇怪案例
相信 Android 开发者都有在 Android Studio 中升级 compileSdkVersion 的经历,这个时候如果你使用了 support 包,并同时升级,那么可能会出现一个错误提示. ...
- Python3之json模块
概念: 序列化(Serialization):将对象的状态信息转换为可以存储或可以通过网络传输的过程,传输的格式可以是JSON,XML等.反序列化就是从存储区域(JSON,XML)读取反序列化对象的状 ...
- DATE类型数据在MySql中减一天的问题
最近在开发一个教务管理系统,数据库中有教师表(Teacher).学生表(Student)等,其中属性:出生日期(Birthday)为DATE类型. 在执行更新教师操作时,发现未改动教师的出生日期但更新 ...
- idea 激活
激活时选择License server,填入 http://idea.wlphp.com:1017 点击Active即可 2DZ8RPRSBU-eyJsaWNlbnNlSWQiOiIyRFo4UlBS ...