http://www.codeweblog.com/stag/flexigrid-jqmshow/
flexigrid页面
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Flexigrid</title>
<link rel="stylesheet" type="text/css" href="resources/flexigrid/css/flexigrid/flexigrid.css" />
<script type="text/javascript" src="resources/js/jquery1.3.2.js"></script>
<script type="text/javascript" src="resources/flexigrid/flexigrid.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#flex1").flexigrid
(
{
url: 'GetUsersList.action',
dataType: 'json',
colModel : [
//{display: '<input type="checkbox" alt=" Select All ">', name : 'getAll', width : 50, sortable : true, align: 'center'},
{display: ' No. ', name : 'id', width : 40, sortable : true, align: 'center'},
{display: ' Name ', name : 'name', width : 40, sortable : true, align: 'center'},
{display: ' Gender ', name : 'gender', width : 180, sortable : true, align: 'left'},
{display: ' Age ', name : 'age', width : 120, sortable : true, align: 'left'},
{display: ' Birthday ', name : 'birthday', width : 130, sortable : true, align: 'left', hide: true},
{display: ' Phone ', name : 'phone', width : 80, sortable : true, align: 'right'},
{display: ' Address ', name : 'address', width : 80, sortable : true, align: 'right'}
],
searchitems : [
{display: ' No. ', name : 'id'},
{display: ' Name ', name : 'name', isdefault: true}
],
sortname: "id",
sortorder: "asc",
usepager: true,
title: ' User list ',
useRp: true,
checkbox : true,// Checkbox if you want
rowId : 'id',// Checkbox binding line id
rp: 10,
showTableToggleBtn: true,// Fold
resizable: true,
striped: true, // Speckle effect is displayed, the default is the parity in the form of interactive
width: 700,
height: 255
}
);
});
</script>
</head>
<body>
<h1>
Flexigrid Example Page
</h1>
<br />
<br />
<table></table>
<br />
<br />
</body>
</html>
分享到:
相关推荐
flexigrid.jsflexigrid.jsflexigrid.jsflexigrid.jsflexigrid.jsflexigrid.jsflexigrid.js
FlexiGrid配置与使用说明,不错的文档
我们都知道flexigrid表格插件的列宽只能设为固定的值,不能使用百分比来自适应窗口的变化。 本例通过修改flexigrid的源代码来实现列宽的自适应变化。如下使用:{display:'XXX',name:'XXX',width:'30%',sortable:...
<link rel="stylesheet" type="text/css" href="css/flexigrid.css" /> <script type="text/javascript" src="jquery-1.2.3.pack.js"></script> <script type="text/javascript" src="flexigrid.js"> $(document)....
此项目是struts2+json+flexigrid的完整实例,可帮助你对flexigrid快速上手,项目下载后直接导入自己的工程即可,所用jar包会另传,因为超出上传限制,还请理解。
《修改jQuery表格插件flexigrid源码添加自定义功能》文章配套代码http://blog.csdn.net/neareast/article/details/12904393,对jquery表格插件flexigrid的源码进行修改,增加了几个自定义功能,对其功能进行了增强。...
Flexigrid与struts2 说明,还有Flexigrid的使用说明和Flexigrid的实例。Flexigrid的包。
Flexigrid它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。
对于flexigrid的使用,各个参数的意义应该不用解释,网上资料很多。插件接收的数据格式对于刚接触的人来说是个麻烦,这是一位兄台的整理,不尽完美但会告诉你如何封装格式。
FlexiGrid(js版本)
Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。 本资源是...
jquery flexigrid与jquery tablesort 配合实现flexigrid的客户端排序功能。jsp项目,无需数据库即可运行
jsp中flexigrid插件在ie下样式问题
jquery表格插件Flexigrid 将数据按照表格排列,类似与ext。
是struts2+json+flexigrid的完整实例所用到的jar包,请大家下载时看清楚。
FlexiGrid 插件简单应用从英文版本改为简体中文版本
Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。 本资源为...
仿flexigrid表格控件,里面有data说明。滚动到底自己加载,可添加表头按钮,有停止滚动加载功能,jquery
flexigrid表格控件的使用实例,实现了和struts1.3的集成,实现了动态添加和删除。 文档包括: user_mgr.jsp ,jsp页面 UserAction.jsp ,控制层Action js包,相关的js jar使用到的jar包
Flexigrid For Asp.Net 多选,客户端排序,自定义