系列索引

Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引

Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数、ColModel API、事件及方法

Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

Web jquery表格组件 JQGrid 的使用 - 6.准备工作 & Hello JQGrid

Web jquery表格组件 JQGrid 的使用 - 7.查询数据、编辑数据、删除数据

Web jquery表格组件 JQGrid 的使用 - 8.Pager、新增数据、查询、刷新、查看数据

Web jquery表格组件 JQGrid 的使用 - 全部代码

Web jquery表格组件 JQGrid 的使用 - 11.问题研究

JQGrid导出Excel文件

目录

使用翻页pager

增加数据

查看、刷新

查询

排序

8.Pager、新增数据、查询、刷新、查看数据

使用翻页pager
设置jqGrid属性:
pager: pager_selector,
需要一个div:
<div id="grid-pager"></div>
注意loadonce: true,必须设置,否则翻页不可用的。
需要设置pager属性。一个pager上不只有翻页功能,还有6个已定义的按钮,当然还可以添加自定义
按钮,参考上面。定义代码如下,这样就可以进行增加,查找,刷新和查看了。
//navButtons
jQuery(grid_selector).jqGrid('navGrid', pager_selector,
{ //navbar options
edit: true,
editicon: 'ui-icon-pencil blue',
edittext: '编辑',
add: true,
addicon: 'ui-icon-circle-plus',
addtext: '新增',
del: true,
delicon: 'ui-icon-circle-close red',
deltext: '删除',
search: true,
searchicon: 'ui-icon-search orange',
searchtext: '查找',
refresh: true,
refreshicon: 'ui-icon-refresh green',
refreshtext: '刷新',
view: true,
viewicon: 'ui-icon-circle-zoomin grey',
viewtext: '查看',
},
{
//edit record form
closeAfterEdit: true,
recreateForm: true,
beforeShowForm: function (e) {
var form = $(e[0]);
form.closest('.ui-jqdialog').find('.ui-jqdialogtitlebar').
wrapInner('<div class="widget-header" />')
style_edit_form(form);
},
afterSubmit: function (response, postdata) {
if (response.responseText != "") {
$(this).jqGrid('setGridParam', { datatype: 'json'
}).trigger('reloadGrid');
alert(response.responseText);
return [true, response.responseText]
}
}
},
{
//new record form
closeAfterAdd: true,
recreateForm: true,
viewPagerButtons: false,
beforeShowForm: function (e) {
var form = $(e[0]);
form.closest('.ui-jqdialog').find('.ui-jqdialogtitlebar').
wrapInner('<div class="widget-header" />')
style_edit_form(form);
},
afterSubmit: function (response, postdata) {
if (response.responseText != "") {
$(this).jqGrid('setGridParam', { datatype: 'json'
}).trigger('reloadGrid');
alert(response.responseText);
return [true, response.responseText]
}
}
},
{ //DELETE
delData: {
delId: function () {
var sel_id = [];
sel_id = $(grid_selector).jqGrid('getGridParam',
'selarrrow');
var value = '';
for (var i = 0; i < sel_id.length; i++) {
value = value + ',' + $(grid_selector).jqGrid('getCell',
sel_id[i], 'UserId');
}
if (value.charAt(0) == ',') {
value = value.substr(1);
}
return value;
}
},
closeOnEscape: true,
closeAfterDelete: true,
reloadAfterSubmit: true,
closeOnEscape: true,
drag: true,
afterSubmit: function (response, postdata) {
if (response.responseText != "") {
alert(response.responseText);
return [true, response.responseText]
}
}
{
//search form
closeOnEscape: true,
closeAfterSearch: true,
reloadAfterSubmit: true,
recreateForm: true,
afterShowSearch: function (e) {
var form = $(e[0]);
form.closest('.ui-jqdialog').find('.ui-jqdialogtitle').
wrap('<div class="widget-header" />')
style_search_form(form);
},
afterRedraw: function () {
style_search_filters($(this));
},
afterSubmit: function (response, postdata) {
if (response.responseText == "") {
$(grid_selector).trigger("reloadGrid", [{ current: true }]);
return [false, response.responseText]
}
else {
$(this).jqGrid('setGridParam', { datatype: 'json'
}).trigger('reloadGrid')
return [true, response.responseText]
}
},
multipleSearch: true
},
{
//view record form
recreateForm: true,
beforeShowForm: function (e) {
var form = $(e[0]);
form.closest('.ui-jqdialog').find('.ui-jqdialogtitle').
wrap('<div class="widget-header" />')
}
}
)
增加数据
if (strOperation == "add")
{
if (CheckUserExist(user.UserCode, ""))
{
strResponse = "用户名重复,请确认!";
}
else
{
strResponse = AddUser(user) ? "用户添加成功!" : "用户添加失败,请
确认!";
}
}
context.Response.Write(strResponse);
private bool AddUser(User objuser)
{
bool flag = false;
string cmdText = "INSERT INTO T_User (UserCode,Password) VALUES ('" +
objuser.UserCode + "','" + objuser.Password + "')";
try
{
SQLHelper sqlhelper = new SQLHelper();
flag = sqlhelper.AddDelUpdate(cmdText) > 0;
}
catch (Exception ex)
{
throw ex;
}
return flag;
}
 
查看、刷新
无需代码。刷新等于重新加载一次。
 
查询
一般无需代码,当然可以自己写,或者遇到问题查询失效时。
//查找
if (context.Request.Params.Get("_search") == "true")
{
string sfilters = context.Request.Params.Get("filters");
context.Response.Write(GetJson(SearchUsersDT(sfilters)));
return;
}
/// <summary>
/// 根据jqgrid的查询操作符和字段拼接sql语句
/// </summary>
/// <param name="op">jqgrid的查询操作符</param>
/// <returns>sql wehere语句</returns>
/// <param name="field">查询字段名称</param>
private string GetSQLOperater(string op, string field)
{
string s = string.Empty;
switch (op)
{
case "eq": return field + " = @" + field;//等于
case "ne": return field + " <> @" + field;//不等于
case "bw": return field + " like @" + field + "'%'"; //开始于
case "bn": return field + " not like @" + field + "'%'"; //不开始于
case "ew": return field + " like '%' + @" + field; //结束于
case "en": return field + " not like '%' + @" + field; //不结束于
case "cn": return field + " like + '%' + " + field + "'%'"; //包含
case "nc": return field + " not like + '%' + @" + field + "'%'"; //不包

case "nu": return "(" + field + " = '' or is null)"; //空值
case "nn": return "(" + field + " <> '' or is not null)"; //非空值
case "in": return ""; //属于
case "ni": return ""; //不属于
default: return "";
}
}
private DataTable SearchUsersDT(string filters)
{
string jsonRes = string.Empty;
System.Runtime.Serialization.Json.DataContractJsonSerializer json = new
System.Runtime.Serialization.Json.DataContractJsonSerializer(typeof(GridSearch));
using (MemoryStream stream = new
MemoryStream(System.Text.Encoding.UTF8.GetBytes(filters)))
{
GridSearch gridSearch = (GridSearch)json.ReadObject(stream);
string groupOp = gridSearch.groupOp;
List<GridSearchRules> Rules = gridSearch.rules;
string sql = "select UserId, UserCode, Password FROM T_User";
MySqlParameter[] paras = new MySqlParameter[Rules.Count];
bool bFirst = true;
for (int i = 0; i < Rules.Count; i++)
{
GridSearchRules r = Rules[i];
string field = r.field;
string op = r.op;
string data = r.data;
sql = bFirst ? sql + " where " + GetSQLOperater(op, field) : sql +
groupOp + GetSQLOperater(op, field);
paras[i] = new MySqlParameter("@" + field, data);
}
SQLHelper sqlhelper = new SQLHelper();
DataTable dt = sqlhelper.Selectinfo(sql);
return dt;
}
}
属于和不属于没试出来是什么操作,直接无视。可以在grid.locale-cn.js文件里找到对应的,删除
后保存即可,其他不需要的查询关系都可以这样。
 
排序
有时也会遇到不能排序的情况。下面就单列排序提供例子,多列暂不考虑。
Oper=null时不一定是第一次加载还有可能是排序。
//排序
if (context.Request.Params.Get("sidx") != null &&
!string.IsNullOrEmpty(context.Request.Params.Get("sidx").ToString()) &&
context.Request.Params.Get("sord") != null &&
!string.IsNullOrEmpty(context.Request.Params.Get("sord").ToString()))
{
context.Response.Write(GetJson(GetUserDTSorted(context.Request.Params.Get("sidx").ToStr
ing(), context.Request.Params.Get("sord").ToString())));
return;
}
private DataTable GetUserDTSorted(string field, string oper)
{
string cmdText = "SELECT UserId, UserCode, UserName, Password, RoleId,
CreateBy, CreateTime FROM T_User order by " + field + " " + oper;
SQLHelper sqlhelper = new SQLHelper();
DataTable dt = sqlhelper.Selectinfo(cmdText);
return dt;
}
 

Web jquery表格组件 JQGrid 的使用 - 8.Pager、新增数据、查询、刷新、查看数据的更多相关文章

  1. Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  2. Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引

    因为内容比较多,所以每篇讲解一些内容,最后会放出全部代码,可以参考.操作中总会遇到各式各样的问题,个人对部分问题的研究在最后一篇 问题研究 里.欢迎大家探讨学习. 代码都经过个人测试,但仍可能有各种未 ...

  3. Web jquery表格组件 JQGrid 的使用 - 11.问题研究

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  4. Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数、ColModel API、事件及方法

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  5. Web jquery表格组件 JQGrid 的使用 - 6.准备工作 &amp; Hello JQGrid

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  6. Web jquery表格组件 JQGrid 的使用 - 7.查询数据、编辑数据、删除数据

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  7. Web jquery表格组件 JQGrid 的使用 - 全部代码

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  8. 扩展HT for Web之HTML5表格组件的Renderer和Editor

    在HT for Web提供了一下几种常用的Editor,分别是: slider:拉条 color picker:颜色选择器 enum:枚举类型 boolean:真假编辑器 string:普通的文本编辑 ...

  9. 第二百二十八节,jQuery EasyUI,TreeGrid(树形表格)组件

    jQuery EasyUI,TreeGrid(树形表格)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使 ...

随机推荐

  1. request_irq() | 注册中断服务函数【转】

    本文转载自:http://blog.csdn.net/wealoong/article/details/7566546#t0 参考  : ARM Linux 中断机制分析.pdf linux-2.6. ...

  2. nvidia 各种卡

    cudnn是针对maxwell优化的啊, maxwell下的各种卡都是游戏卡,具体可以见: https://developer.nvidia.com/maxwell-compute-architect ...

  3. MySQL 百万级分页优化

    MySQL 百万级分页优化 http://www.jb51.net/article/31868.htm 一般刚开始学SQL的时候,会这样写 : , ; 但在数据达到百万级的时候,这样写会慢死 : , ...

  4. android147 360 程序锁fragment

    package com.itheima.mobileguard.fragment; import java.util.ArrayList; import java.util.List; import ...

  5. jQurey对表单表格的操作及更多应用(方法型)

  6. 一本QT书,连接MySQL图文并茂

    http://qtdebug.com/index.html http://qtdebug.com/DB-AccessMySQL.html

  7. apt-get 依赖修复

    apt-get cleanapt-get update apt-get -f install dpkg --configure -a

  8. 以太坊客户端Geth命令用法-参数详解

    Geth在以太坊智能合约开发中最常用的工具(必备开发工具),一个多用途的命令行工具. 熟悉Geth可以让我们有更好的效率,大家可收藏起来作为Geth命令用法手册. 本文主要是对geth help的翻译 ...

  9. 使用Ext JS,不要使用页面做组件重用,尽量不要做页面跳转

    今天,有人请教我处理办法,问题是: 一个Grid,选择某条记录后,单击编辑后,弹出编辑窗口(带编辑表单),编辑完成后单击保存按钮保存表单,并关闭窗口,刷新Grid. 这,本来是很简单的,但囿于开发人员 ...

  10. 使用excel估计GARCH模型参数——以GARCH(1,1)为例

    本文的知识点:使用excel求解GARCH模型的系数,以GARCH模型为例,主要采用的是极大似然估计法MLE. 同时给出了R语言的输出结果作为对照验证.     参考了:http://investex ...