mushme
- 浏览: 777644 次
- 性别:
- 来自: 西安
-
文章分类
最新评论
-
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配置成服务
jqgrid做表格很方便，mark一个简单的例子
以下是一个从外部或许数据的例子，用json来传值
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>qgrid.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link id="uiThemes" 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" />
<!-- 引入jQuery -->
<script type="text/javascript" src="scripts/jQuery/jquery-1.3.2.js"></script>
<script src="scripts/jQuery/plugins/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>
<script src="scripts/jQuery/plugins/grid.locale-zh_CN.js" type="text/javascript"></script>
<script src="scripts/jQuery/plugins/jquery.jqGrid.min.js" type="text/javascript"></script>
</head>
<body>
<table id="gridTable"></table>
<div id="gridPager"></div>
<script type="text/javascript">
$(function()
{
$("#gridTable").jqGrid({
datatype: "local",
height: 250,
colNames:['编号','用户名', '性别', '邮箱', 'QQ','手机号','出生日期'],
colModel:[
{name:'id',index:'id', width:60, sorttype:"int"},
{name:'userName',index:'userName', width:90},
{name:'gender',index:'gender', width:90},
{name:'email',index:'email', width:125,sorttype:"string"},
{name:'QQ',index:'QQ', width:100},
{name:'mobilePhone',index:'mobilePhone', width:120},
{name:'birthday',index:'birthday', width:100, sorttype:"date"}
],
sortname:'id',
sortorder:'asc',
viewrecords:true,
rowNum:10,
rowList:[10,20,30],
pager:"#gridPager",
caption: "第一个jqGrid例子"
}).navGrid('#gridPager',{edit:false,add:false,del:false});
var mydata = [
{id:"1",userName:"polaris",gender:"男",email:"fef@163.com",QQ:"33334444",mobilePhone:"13223423424",birthday:"1985-10-01"},
{id:"2",userName:"李四",gender:"女",email:"faf@gmail.com",QQ:"222222222",mobilePhone:"13223423",birthday:"1986-07-01"},
{id:"3",userName:"王五",gender:"男",email:"fae@163.com",QQ:"99999999",mobilePhone:"1322342342",birthday:"1985-10-01"},
{id:"4",userName:"马六",gender:"女",email:"aaaa@gmail.com",QQ:"23333333",mobilePhone:"132234662",birthday:"1987-05-01"},
{id:"5",userName:"赵钱",gender:"男",email:"4fja@gmail.com",QQ:"22222222",mobilePhone:"1343434662",birthday:"1982-10-01"},
{id:"6",userName:"小毛",gender:"男",email:"ahfi@yahoo.com",QQ:"4333333",mobilePhone:"1328884662",birthday:"1987-12-01"},
{id:"7",userName:"小李",gender:"女",email:"note@sina.com",QQ:"21122323",mobilePhone:"13220046620",birthday:"1985-10-01"},
{id:"8",userName:"小三",gender:"男",email:"oefh@sohu.com",QQ:"242424366",mobilePhone:"1327734662",birthday:"1988-12-01"},
{id:"9",userName:"孙先",gender:"男",email:"76454533@qq.com",QQ:"76454533",mobilePhone:"132290062",birthday:"1989-11-21"}
];
for(var i=0;i<=mydata.length;i++)
jQuery("#gridTable").jqGrid('addRowData',i+1,mydata[i]);
});
</script>
</body>
</html>
以下是一个从外部或许数据的例子，用json来传值
<script type="text/javascript">
$(function()
{
$("#gridTable").jqGrid({
url:'jqGridServlet',
datatype: "json",
height: 250,
colNames:['编号','用户名', '性别', '邮箱', 'QQ','手机号','出生日期'],
colModel:[
{name:'id',index:'id', width:60, sorttype:"int"},
{name:'userName',index:'userName', width:90},
{name:'gender',index:'gender', width:90},
{name:'email',index:'email', width:125,sorttype:"string"},
{name:'QQ',index:'QQ', width:100},
{name:'mobilePhone',index:'mobilePhone', width:120},
{name:'birthday',index:'birthday', width:100, sorttype:"date"}
],
sortname:'id',
sortorder:'asc',
viewrecords:true,
rowNum:10,
rowList:[10,20,30],
jsonReader:{
repeatitems : false
},
pager:"#gridPager",
caption: "jqGrid与Servlet集成"
}).navGrid('#gridPager',{edit:false,add:false,del:false});
})
</script>
</head>
<body>
<table id="gridTable"></table>
<div id="gridPager"></div>
</body>
分享到：
发表评论
-
zhihu图片无法显示问题插件
2017-07-26 13:49 787知乎改成全站https后，部分图片总是无法显示。 测试了下，图 ... -
makr一个base64编码和解码的js
2013-05-22 14:27 4302可以和这个对照：mark一个base64的编码和解码工具类 h ... -
jrcode生成二维码
2013-01-30 17:09 2452官网地址：http://jeromeetienne.githu ... -
根据数字生成一维码
2013-01-30 16:33 5108jquery-barcode是个非常不错的jquery，可以生 ... -
jQuery MsgBox Plugin[转]
2012-07-16 16:24 1157jQuery MsgBox Plugin 提供四个插件方法： ... -
jqgrid属性只colmodel
2012-07-11 08:27 2480转自：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 1337<script type="text/ja ... -
获取鼠标当前位置的js
2011-07-30 14:20 1306获取鼠标坐标的js，来源http://www.cnblogs. ... -
原生态的js map
2011-07-14 13:56 1244<script> var map = {}; ... -
jqgrid数据转换
2011-06-11 16:22 2278$("#grid_id").jqGri ... -
jquery只允许输入整数
2011-04-14 10:21 28111.只允许输入整数 jQuery.validator.ad ... -
生成表单json字串
2011-02-10 13:44 1369在网上找到一个生成表单的json字串的代码，记录下 < ... -
jqgrid学习记录，从外部url获取json数据
2011-01-21 13:39 14816从http://a3mao.iteye.com学习，自己做了个 ... -
强大的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 3822form是不能嵌套的，嵌套后会导致第一个form后的数据都不能 ... -
复制粘贴的js
2011-01-03 21:49 1484<title></title> ...
相关推荐
jqgrid 编辑表格 一列
; charset=utf-8"> <title>Insert title here ...<link type="text/css" rel="stylesheet" href="css/ui.jqgrid.css"> <script type="text/javascript" src="js/jquery-1.11.0.min.js" ></script> ...
jqgrid表格，单元格合并，并显示，demo版本
jqGrid的表格的每行每列的数据既显示又可以编辑。
实现行的合并 添加行 删除行 添加日期等功能
JqGrid是一款功能强大的Jquery表格控件,支持排序,分组,分页,行内编辑,表格树,行内表格等多种功能，该版本为官方最新版，附带Demo
代码简介：jqGrid表格内容查询读取代码是一款列表详细页表格布局，生成表格内容，表格查询代码等。
jqGrid表格数据展示插件，可以做出很多很炫酷的效果,你值得拥有
jqGrid【表格】表格属性大全 Table表格对象 Table对象:表示HTML文档中的表，对于文档中每个标记，浏览器都创建一个Table对象.
jqGrid是基于jquery的一个表格插件，demo中可自适应窗口大小，且单元格数据较多时，可单行显示
jqGrid表格插件——参数配置，使用举例
之前网上没找到现成的jqgrid表格前台导出插件，都或多或少带后台，也不想换表格插件，所以参照extjs自己改了个前台导出插件，支持多表头和分组table带表头导出，引用方法文件有详细注释，直接能用，如有不足还请见谅...
前端页面点击导出jqgrid表格为excel表格代码，有表格样式设置的代码，可以参考一下，这是我刚开始工作的时候写的，希望可以帮助像我一样的菜鸟。
jqGrid是一个非常好用的免费开源Grid组件，功能强大，适用于各种表格操作，数据管理。作为jquery插件，jqGrid使用方便，简介，美观。
jqgriddemo,样式漂亮，可以直接使用，满足多种复杂的前端表格操作功能，有需要的小伙伴可以学习学习
NULL 博文链接：https://rikugun.iteye.com/blog/253149
jqGrid表格内容查询读取代码是一款列表详细页表格布局，生成表格内容，表格查询代码等。
jqgrid 表格的增删改查4种操作，以及表格分页，还有修改以及添加时候的modal弹出框。代码是个project项目文件，需要自己建个解决方案将项目包含进去。
jquery 表格插件，功能强大，适合于学习jquery 技术的同学
NULL 博文链接：https://vipshow.iteye.com/blog/1812381