- 浏览: 777626 次
- 性别:
- 来自: 西安
文章分类
最新评论
-
mushme:
W.sl 写道大神:http://mushme.iteye.c ...
用python自动登录iteye -
W.sl:
大神:http://mushme.iteye.com/logi ...
用python自动登录iteye -
mushme:
jilong-liang 写道 public static v ...
选择一个好的驾校,用数据说话,我用python -
jilong-liang:
package sm;import java.net.URL; ...
选择一个好的驾校,用数据说话,我用python -
sunshine_bean:
非常感谢
jsvc将tomcat配置成服务
从http://a3mao.iteye.com学习,自己做了个简单的例子,mark下,以后方便查找
1.前台显示页面,包含了配置的完整注释
2.生成数据的jsp
jsonreader的几处关键配置说明,注释中已经标识,此处再说明下
整个项目已经打包上传到附件。时间:20120701
内容已更新,时间:20120710
此内容包含的js引用较多,代码是可用的,我再找找源文件,打包上来。
整个项目已经打包上传到附件,可以直接导入eclipse中使用。
此内容包含的js引用较多,代码是可用的,我再找找源文件,打包上来。
1.前台显示页面,包含了配置的完整注释
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>base.html</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script src="/scripts/jQuery/jquery-1.3.2.js" type="text/javascript"></script> <link rel="stylesheet" type="text/css" media="screen" href="/styles/themes/redmond/jquery-ui-1.7.2.custom.css" /> <link rel="stylesheet" type="text/css" media="screen" href="/styles/themes/ui.jqgrid.css" /> <script type="text/javascript" src="/scripts/jQuery/jquery-1.3.2.js"></script> <script type="text/javascript" src="/scripts/jQuery/plugins/jquery-ui-1.7.2.custom.min.js"></script> <script type="text/javascript" src="/scripts/jQuery/plugins/grid.locale-zh_CN.js"></script> <script type="text/javascript" src="/scripts/jQuery/plugins/jquery.jqGrid.min.js"></script> <style> <!-- jquery-ui的字体大小与jqgrid字体大小不一致,故需要在页面上在加此style来指定页面上文字大小 --> html, body { margin: 0; padding: 0; font-size: 75%; } </style> <script type="text/javascript"> $(document).ready(function(){ jQuery("#jsonTable").jqGrid({ //jsonTable为页面中需要显示内容的table的id url:'/study/json-data.jsp', //生成json数据的url源 datatype: 'json', //从服务器端返回的数据类型,默认xml。可选类型:xml,local,json,jsonnp,script,xmlstring,jsonstring,clientside colNames:['编号','姓名','密码','年龄','地址','出生日期'], //表格的显示字段 colModel:[ {name:'id',index:'id', width:90,sorttype:"int"}, //name表格列的名称,index排序时字段的索引,width只能是像素,不能是百分比 {name:'username',index:'name', width:110,sorttype:"int"}, {name:'password',index:'password', width:80}, {name:'age',index:'age', width:80}, {name:'address',index:'address', width:80}, {name:'time',index:'time', width:80,sorttype:"date"} ], rowNum:10, //在grid上显示记录条数,也就是pageSize,这个参数是要被传递到后台 rowList:[10,20,30], //用来改变显示记录数,当选择时会覆盖rowNum参数传递到后台 pager: "datapager", //datapager为显示页码的div multiselect: false, //是否可多选,多选的话前面有多选框 sortname: 'id', //默认的排序列。可以是列名称或者是一个数字,这个参数会被提交到后台 viewrecords: true, //是否显示记录总数 sortorder: "desc", cellEdit:false, //是否可以编辑表格 lastpage:20, // caption: "第一个表格", //表格名称 height: 220, jsonReader: { //jsonReader来跟服务器端返回的数据做对应 root: "dataRows", //包含实际数据的数组 page: "currPage", //当前页 total: "totalPage",//总页数 records:"totalCount", //查询出的记录数 repeatitems : false }, onSelectRow: function(id){ alert("第"+id+"行被选中"); }, onPaging:function(){ alert("翻页键被按下"); } }).navGrid('datapager', {view:true,edit:true,add:false,del:false}, {closeOnEscape:true} ); }); </script> </head> <body> <table id="jsonTable"></table> <div id="datapager"></div> </body> </html>
2.生成数据的jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% StringBuffer sb=new StringBuffer(); sb.append("{totalPage:18,currPage:3,totalCount:300,'dataRows':[{'password':'123','age':20,'address':'USA','username':'王三','id':0},{'password':'123','age':21,'address':'USA','username':'王三','id':1},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':22,'address':'USA','username':'王三','id':2}"); sb.append(",{'password':'123','age':21,'address':'USA','username':'王三','id':11},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':21,'address':'USA','username':'王三','id':1},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':22,'address':'USA','username':'王三','id':2}"); sb.append(",{'password':'123','age':21,'address':'USA','username':'王三','id':12},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':21,'address':'USA','username':'王三','id':1},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':22,'address':'USA','username':'王三','id':2}"); sb.append(",{'password':'123','age':21,'address':'USA','username':'王三','id':13},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':21,'address':'USA','username':'王三','id':1},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':22,'address':'USA','username':'王三','id':2}"); sb.append(",{'password':'123','age':21,'address':'USA','username':'王三','id':14},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':21,'address':'USA','username':'王三','id':1},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':22,'address':'USA','username':'王三','id':2}"); sb.append(",{'password':'123','age':21,'address':'USA','username':'王三','id':15},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':21,'address':'USA','username':'王三','id':1},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':22,'address':'USA','username':'王三','id':2}"); sb.append(",{'password':'123','age':21,'address':'USA','username':'王三','id':16},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':21,'address':'USA','username':'王三','id':1},{'password':'123','age':22,'address':'USA','username':'王三','id':2},{'password':'123','age':22,'address':'USA','username':'王三','id':2}"); sb.append("],'rows':10}"); out.print(sb.toString()); %>
jsonreader的几处关键配置说明,注释中已经标识,此处再说明下
jsonReader: { //jsonReader来跟服务器端返回的数据做对应 root: "dataRows", //包含实际数据的数组 page: "currPage", //当前页 total: "totalPage",//总页数 records:"totalCount", //查询出的记录数 repeatitems : false }
整个项目已经打包上传到附件。时间:20120701
内容已更新,时间:20120710
- jqGrid.zip (4.3 MB)
- 下载次数: 194
评论
3 楼
mushme
2012-07-01
mushme 写道
wlsuger 写道
你好,感谢分享,但是你发的例子怎么跑不起来呢 报44行错误
此内容包含的js引用较多,代码是可用的,我再找找源文件,打包上来。
整个项目已经打包上传到附件,可以直接导入eclipse中使用。
2 楼
mushme
2012-06-13
wlsuger 写道
你好,感谢分享,但是你发的例子怎么跑不起来呢 报44行错误
此内容包含的js引用较多,代码是可用的,我再找找源文件,打包上来。
1 楼
wlsuger
2012-06-13
你好,感谢分享,但是你发的例子怎么跑不起来呢 报44行错误
发表评论
-
zhihu图片无法显示问题插件
2017-07-26 13:49 787知乎改成全站https后,部分图片总是无法显示。 测试了下,图 ... -
makr一个base64编码和解码的js
2013-05-22 14:27 4301可以和这个对照:mark一个base64的编码和解码工具类 h ... -
jrcode生成二维码
2013-01-30 17:09 2451官网地址:http://jeromeetienne.githu ... -
根据数字生成一维码
2013-01-30 16:33 5107jquery-barcode是个非常不错的jquery,可以生 ... -
jQuery MsgBox Plugin[转]
2012-07-16 16:24 1157jQuery MsgBox Plugin 提供四个插件方法: ... -
jqgrid属性只colmodel
2012-07-11 08:27 2479转自:http://blog.whiledo.com/arch ... -
批量设置输入框的只读属性
2011-11-17 15:45 2321时间或者选择带出的东西,都需要设置成只读,不让用户自己输入 有 ... -
表单验证,在每一个有requred类的文本框后加入“*”以提示必填项
2011-10-25 13:22 4928$("form :input.required&qu ... -
加载Google cdn jQuery库
2011-10-20 08:50 1336<script type="text/ja ... -
获取鼠标当前位置的js
2011-07-30 14:20 1306获取鼠标坐标的js,来源http://www.cnblogs. ... -
原生态的js map
2011-07-14 13:56 1243<script> var map = {}; ... -
jqgrid数据转换
2011-06-11 16:22 2278$("#grid_id").jqGri ... -
jquery只允许输入整数
2011-04-14 10:21 28101.只允许输入整数 jQuery.validator.ad ... -
生成表单json字串
2011-02-10 13:44 1368在网上找到一个生成表单的json字串的代码,记录下 < ... -
jqgrid做表格
2011-01-20 17:28 2908jqgrid做表格很方便,mark一个简单的例子 < ... -
强大的jquery验证框架
2011-01-20 15:42 1859jquery的验证太强大了,很容易就可以上手了,长度,必填,自 ... -
复制内容的js,通过json来实现
2011-01-20 11:27 2053复制内容的js。 需求是一个网站在收集用户的信息,内部的一个系 ... -
js表格求和
2011-01-20 10:12 4499此代码用js在客户端自动求和,具体可以根据自己的要求拓展 ... -
form嵌套问题
2011-01-19 17:07 3821form是不能嵌套的,嵌套后会导致第一个form后的数据都不能 ... -
复制粘贴的js
2011-01-03 21:49 1484<title></title> ...
相关推荐
jqGrid 学习 配置 json 35 jqGrid 学习 方法 37 jqGrid 学习 事件 45 jqGrid 学习 数据 48 jqGrid 学习 ColModel API 55 jqGrid 学习 参数(2) 57 jqGrid 学习 jqGrid 参数 63 jqGrid 学习 第一个实例 63 使用 ...
下面可以获取选择一行的id,如果你选择多行,那下面的id是最后选择的行的id: ...如果想获取选择的行的数据,只要传入rowId即可,如下: var rowData = $(“#gridTable”).jqGrid(‘getRowData',rowId);
Jqgrid json 自身带的分页功能, 为了减轻数据库压力和提高加载速度,生成了纯JSON文件,想在本地自动分页,找了N多API均没有详细的介绍,最终摸索出来一个属性本身就自带分页功能,与大家分享
本Demo利用Jquery的jqgrid插件利用本地资源数据,实现分页。
jqgrid学习
jqgrid加载本地数据并且分页例子,下载直接搭环境使用
C# MVC4框架 引用了JQGRID(SUBGRID) 和 JSTREE 做的DEMO 仅供参考 包含数据库文件
jqGrid数据调用实例
NULL 博文链接:https://tanlingcau.iteye.com/blog/779261
jqgrid加载本地数据并且分页例子
NULL 博文链接:https://only-xxp.iteye.com/blog/768029
学习jqgrid自己整理的一些笔记,希望对大家有所帮助
JQuery Mobile 中实现 jqGrid 数据分组的一个小例子 程序请放在WEB服务器上运行
一个jqGrid例子 使用datatype: "local",JSON数据写在页面中时分页、搜索一切正常。 但使用datatype: getProducts, 时点击搜索、排序时数据每次拷贝了一份,(即:原数据有10条,操作后就成20条。。。。)。
jqgrid
现在把找好的分页参数跟大家分享下
NULL 博文链接:https://johnson-gong.iteye.com/blog/1921058
jqGrid单元格自定义显示设置及getRowData获取原始数据示例
jquery.jqGrid-4.6.0(jquery表格插件).zip----------jqGrid4.6.0包,官网下载的,原封不动的在这里。 jqgrid_demo40-----可用的-使用方法请查看README文件.rar-----------经我修改过的demo40,官网上面demo40下载...