一个典型的 jquery flexigrid配置

转载 2015年07月08日 21:22:36

{height: 200, //插件的高度,单位为px,高度也可以为auto,如果是auto,则有几行就会是几行的高度
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,是否可以动态设置每页显示的结果数
hideOnSubmit: true, //是否在回调时显示遮盖
showTableToggleBtn: false, //是否显示【显示隐藏Grid】的按钮
autoload: true, //自动加载,即第一次发起ajax请求
blockOpacity: 0.5, //透明度设置
onToggleCol: false, //当在行之间转换时,可在此方法中重写默认实现,基本无用
onChangeSort: false, //当改变排序时,可在此方法中重写默认实现,自行实现客户端排序
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点击头脚本报错。

onSuccess: false, //成功后执行,这个挺有用
onSubmit: false, // 调用自定义的计算函数,基本没用
//Style
gridClass: “bbit-grid”//样式
}

Flexigrid  colModel 的配置,在配置中 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的button设置
属性名        类型        描述
name        string        按钮名称
bgclass        string        样式
onpress        function    点击触发的方法
separator    bool        分割线
———————————————————————————————-

Flexigrid的searchitems配置
属性名        类型        描述
display        string        搜索类型下拉列表框:显示的列名
name        string        搜索类型下拉列表框:绑定的列名
isdefault    bool        是否为默认搜索类型
//注:如果searchitems:true,则自动根据所有字段生成下拉列表框

Jquery插件FLexiGrid完全配置

首先.去下载FlexGrid http://www.flexigrid.info/ ,下载完成后.解压开有__MACOSX和flexigrid两个文件夹 ,主要使用flexigrid里面的文件   ...
  • cuiwei1026522829
  • cuiwei1026522829
  • 2014年01月20日 12:59
  • 1383

jQuery插件flexigrid使用总结

一、参考资料 1、jQuery插件flexiGrid的完全使用,附代码下载 2、修改flexigrid源码一(json,checkbox)[原创] 3、jQuery +UI + fl...
  • binyao02123202
  • binyao02123202
  • 2014年02月02日 10:25
  • 8749

jQuery插件flexiGrid的完全使用,附代码下载

在这个例子中其实不光使用了flexiGrid,还有 http://gundumw100.iteye.com/blog/543977,跟本例无关--> 这些插件 可以先看看下面...
  • gundumw100
  • gundumw100
  • 2017年04月10日 17:48
  • 202

基于jQuery的FlexiGrid的插件使用和改造

已不推荐下载,如要下载去这个连接下载最新的 http://gundumw100.iteye.com/admin/blogs/545610 http://www.cnblogs.com/xuanye/...
  • gundumw100
  • gundumw100
  • 2017年04月10日 17:47
  • 126

用flexigrid实现分页显示 一

flexigrid的深度定制,演示如何实现分页功能,适合JavaScript老手
  • sheismylife
  • sheismylife
  • 2013年08月11日 11:12
  • 5216

jquery demo - jquery表格插件flexigrid的java简单应用实例

flexigrid效果堪比extjs,  是一个很不错了jquery表格插件 先看效果,  显示简单显示数据: 插件自动发送指定的ajax请求, 只需返回固定格式的json字符串就...
  • ghyg525
  • ghyg525
  • 2013年12月27日 15:52
  • 3008

FlexiGrid使用手册

一、概览 Flexigrid是一个基于jQuery开发的Grid,与 Ext Gird类似。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。 它的功能包括: s  调整...
  • Leolu007
  • Leolu007
  • 2015年06月11日 14:37
  • 2609

flexigrid 绑定事件process以及对行列的操作

$(document).ready(function(){ $("#monthPlanListGrid").flexigrid({ width: '1000', ...
  • woshishui6501
  • woshishui6501
  • 2014年07月12日 11:08
  • 4554

Jquery插件flexigrid 参数 详解

1、flexigrid参数说明:     height: 200, //flexigrid插件的高度,单位为px     width: 'auto', //宽度值,auto表示根据每列的宽度自动计...
  • Shb_derek
  • Shb_derek
  • 2013年06月03日 16:33
  • 1525

jquery插件FlexiGrid的使用(已更新)

已不推荐下载,如要下载去这个连接下载最新的 http://gundumw100.iteye.com/blog/545610 更新于2009-11-30 先看一下FlexiGrid的参数 hei...
  • gundumw100
  • gundumw100
  • 2017年04月10日 17:47
  • 73
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:一个典型的 jquery flexigrid配置
举报原因:
原因补充:

(最多只允许输入30个字)