项目用到这玩意,像样的API都是英文的,英文不好,所以经过各种搜集,flexigrid就整理了这么多用得上的东西,用不上的没有整理进来。
flexigrid参数说明:
height: 200, //flexigrid插件的高度,单位为px
width: 'auto', //宽度值,auto表示根据每列的宽度自动计算,在IE6下建议设置具体值否则会有问题
striped: true, //是否显示斑纹效果,默认是奇偶交互的形式
novstripe: false,//没用过这个属性
minwidth: 30, //列的最小宽度
minheight: 80, //列的最小高度
resizable: false, //resizable table是否可伸缩
url: false, //ajax url,ajax方式对应的url地址
method: 'POST', // data sending method,数据发送方式
dataType: 'json', // type of data loaded,数据加载的类型,xml,json
errormsg: '发生错误', //错误提升信息
usepager: false, //是否分页
nowrap: true, //是否不换行
page: 1, //current page,默认当前页
total: 1, //total pages,总页面数
useRp: true, //use the results per page select box,是否可以动态设置每页显示的结果数
rp: 25, // results per page,每页默认的结果数
rpOptions: [10, 15, 20, 25, 40, 100], //可选择设定的每页结果数
title: false, //是否包含标题
pagestat: '显示记录从{from}到{to},总数 {total} 条', //显示当前页和总页面的样式
procmsg: '正在处理数据,请稍候 ...', //正在处理的提示信息
query: '', //搜索查询的条件
qtype: '', //搜索查询的类别
qop: "Eq", //搜索的操作符
nomsg: '没有符合条件的记录存在', //无结果的提示信息
minColToggle: 1, //允许显示的最小列数
showToggleBtn: true, //是否允许显示隐藏列,该属性有bug设置成false点击头脚本报错。
hideOnSubmit: true, //是否在回调时显示遮盖
showTableToggleBtn: false, //是否显示【显示隐藏Grid】的按钮
autoload: true, //自动加载,即第一次发起ajax请求
blockOpacity: 0.5, //透明度设置
onToggleCol: false, //当在行之间转换时,可在此方法中重写默认实现,基本无用
onChangeSort: false, //当改变排序时,可在此方法中重写默认实现,自行实现客户端排序
onSuccess: false, //成功后执行
onSubmit: false, // 调用自定义的计算函数,基本没用
//Style
gridClass: "bbit-grid"//样式
}, p);
----------------------------------------------------------------------------------------------
支持ajax跨域:
url中加callback=?
后台获得callback函数的名字
返回json数据格式为:print(callbackName+"("+jsonString+")");
----------------------------------------------------------------------------------------------
Flexigrid(HUGO.CM修改版v1.1)使用说明:
1、加载flexigrid。p:选项参数集合
$(“”).flexigrid(p);
2、重新加载数据。
$(“”).flexReload(p);
3、更改flexigrid参数。P:选项参数集合
$(“”).flexOptions (p);
4、隐藏/显示列。cid:列索引,visible:bool
$(“”).flexToggleCol (cid, visible);
5、绑定数据。Data:数据源
$(“”).flexAddData (data);
6、no select plugin by me 。不知道做什么用的
$(“”).noSelect (p);
7、重新指定宽度和高度。
$(“”).flexResize(w,h);
8、翻页。type:first、prev、next、last、input
$(“”).changePage(type);
----------------------------------------------------------------------------------------------
Flexigrid——colModel:
属性名 类型 描述
display string 显示的列名
name string 绑定的列名
sortable bool 是否可以排序
align string 对其方式
width int 列的宽度
hide bool 是否隐藏该列
pk bool 是否为主键标识、如果是则隐藏该列,值存入隐藏域中
process function
customValue function 自定义显示值。(如性别:数据库为Bit类型,通过customValue方法返回“男/女”)参数:value,i
----------------------------------------------------------------------------------------------
Flexigrid——事件
事件名 参数 描述 返回值
onDragCol dcoln,dcolt 拖动列后触发 无
onToggleCol cid,visible 隐藏/显示列后触发 无
onChangeSort sortname,sortorder 自定义排序事件 无
onChangePage newp 自定义翻页事件 无
onSuccess 无 数据获取成功时触发 无
onError XMLHttpRequest,textStatus,errorThrown 出现错误时触发 无
onSubmit 无 在获取数据前时触发 bool
onRowSelect this 行选中事件 无
----------------------------------------------------------------------------------------------
Flexigrid——buttons
属性名 类型 描述
name string 按钮名称
bgclass string 样式
onpress function 点击触发的方法
separator bool 分割线
----------------------------------------------------------------------------------------------
Flexigrid——searchitems
属性名 类型 描述
display string 搜索类型下拉列表框:显示的列名
name string 搜索类型下拉列表框:绑定的列名
isdefault bool 是否为默认搜索类型
//注:如果searchitems:true,则自动根据所有字段生成下拉列表框
分享到:
相关推荐
Flexigrid的使用说明: 1. 引入库:首先,你需要在HTML页面中引入Flexigrid的CSS和JavaScript文件。这通常包括`flexigrid.css`和`jquery.flexigrid.js`。同时,别忘了引入jQuery库,因为Flexigrid依赖于jQuery。 2. ...
对于flexigrid的使用,各个参数的意义应该不用解释,网上资料很多。插件接收的数据格式对于刚接触的人来说是个麻烦,这是一位兄台的整理,不尽完美但会告诉你如何封装格式。
`Jquery_FlexiGrid配置参数说明.txt`文档会列出Flexigrid插件支持的所有配置参数及其用途。了解这些参数对于定制化插件的行为至关重要。例如,`width`用来设置表格的宽度,`height`设置高度,`colModel`定义列的属性...
**步骤1:**检查FlexiGrid官方文档中关于IE兼容性的说明,并根据需要调整CSS代码。 **步骤2:**使用条件注释加载针对IE8的特殊样式表: ```html <!--[if IE 8]> <![endif]--> ``` **步骤3:**对于DOM操作问题,...
我们都知道flexigrid表格插件的列宽只能设为固定的值,不能...如下使用:{display:'XXX',name:'XXX',width:'30%',sortable:false,align:center',hide: false},内附使用说明txt,这个是本人自己修改的,不足之处请见谅。
下面将详细解释`flexigrid`参数说明中的各项设置: 1. `height`:设置flexigrid插件的高度,单位为像素,默认值为200px。这决定了网格可视区域的高度。 2. `width`:设定插件的宽度,'auto'表示根据每列的宽度自动...
附带的“附带属性说明.txt”文件可能包含了更多关于Flexigrid的配置选项和方法的详细信息。通常,Flexigrid的其他重要属性和方法包括: - `width` 和 `height`:定义表格的宽度和高度。 - `usepager`:设置是否启用...
以下是对这些技术及其在实际应用中的详细说明: 1. **Struts2**:Struts2 是一个基于 MVC(Model-View-Controller)设计模式的Java Web框架,用于简化和组织大型应用的开发。它提供了强大的拦截器机制,支持多种...
多个优秀的插件,如日期、表格、右键等插件,支持ajax异步获取数据以及各种数据格式,包括xml,json等,表格的美工做的不错,挺漂亮的。网上最初始的不够优秀,这是一个前辈的改良版,非常不错。
主要是实现flexigrid在struts2架构中的增删改查的功能。 部署说明: flexieGridStrut文件夹为源码。 accountant.sql 为数据库代码。 部署步骤: 把flexieGridStrut导入到Myeclipse。 在mysql里面运行accountant....
5. 文档:可能包含关于如何使用和自定义天蓝色主题的说明。 使用天蓝色主题的步骤大致如下: 1. 引入jQuery库和Flexigrid的核心JavaScript文件。 2. 引入天蓝色主题的CSS文件,确保在HTML文档中正确链接。 3. 初始...
依赖组件包括Jquery、Flexigrid、Digester、Freemarker、Sojo、Log4j、Beanutils、Collections、Hsqldb(示例运行需要)和Hibernate等,这些组件共同确保了FisherGrid的强大功能和稳定运行。 总的来说,FisherGrid...
以下是这些插件的详细说明: 1. **jQuery.contextMenu** jQuery.contextMenu插件允许开发人员自定义右键菜单,这在网页应用中非常常见。通过这个插件,你可以轻松创建具有不同选项和操作的上下文菜单,提高用户...
以下是根据标题和描述中提到的一些jQuery表格插件的详细说明: 1. DataTables:DataTables是一个功能丰富的表格增强插件,提供了搜索、排序、分页和自定义列显示等特性。它的在线例子展示了如何通过API控制表格的...