Jquery FlexiGrid配置参数说明

来看看它的功能有哪些吧？官方的功能列表

• Resizable columns  （重设列宽，酷）
• Resizable height and width  （重设表格大小，这个好像实际应用的不多）
• Sortable column headers  (改变列的顺序)
• Cool theme （很酷的风格，现在就更酷了）
• Can convert an ordinary table  （可以格式化一个普通的表格）
• Ability to connect to an ajax data source (XML and JSON[new])  （支持多种数据格式）
• Paging （支持分页）
• Show/hide columns （支持显示隐藏列） 
• Toolbar (new)  （支持工具栏）
• Search (new)  （支持快速检索）
• Accessible API  （易于使用的API）
• Many more （其他。白搭）

 

还是和其他控件一下，第一步来看下参数吧，默认参数比较多，大多的参数都比较有用

01.      

02.// 引用默认属性

03.        p = $.extend({

04.            height: 200, //flexigrid插件的高度，单位为px

05.            width: 'auto', //宽度值，auto表示根据每列的宽度自动计算，在IE6下建议设置具体值否则会有问题

06.            striped: true, //是否显示斑纹效果，默认是奇偶交互的形式

07.            novstripe: false,//没用过这个属性

08.            minwidth: 30, //列的最小宽度

09.            minheight: 80, //列的最小高度

10.            resizable: false, //resizable table是否可伸缩

11.            url: false, //ajax url,ajax方式对应的url地址

12.            method: 'POST', // data sending method,数据发送方式

13.            dataType: 'json', // type of data loaded,数据加载的类型，xml,json

14.          errormsg: '发生错误', //错误提升信息

15.            usepager: false, //是否分页

16.            nowrap: true, //是否不换行

17.            page: 1, //current page,默认当前页

18.            total: 1, //total pages,总页面数

19.            useRp: true, //use the results per page select box,是否可以动态设置每页显示的结果数

20.            rp: 25, // results per page,每页默认的结果数

21.            rpOptions: [10, 15, 20, 25, 40, 100], //可选择设定的每页结果数

22.            title: false, //是否包含标题

23.            pagestat: '显示记录从{from}到{to}，总数 {total} 条', //显示当前页和总页面的样式

24.            procmsg: '正在处理数据，请稍候 ...', //正在处理的提示信息

25.            query: '', //搜索查询的条件

26.            qtype: '', //搜索查询的类别

27.            qop: "Eq", //搜索的操作符

28.            nomsg: '没有符合条件的记录存在', //无结果的提示信息

29.            minColToggle: 1, //允许显示的最小列数

30.            showToggleBtn: true, //是否允许显示隐藏列，该属性有bug设置成false点击头脚本报错。

31.            hideOnSubmit: true, //是否在回调时显示遮盖

32.            showTableToggleBtn: false, //是否显示【显示隐藏Grid】的按钮 

33.            autoload: true, //自动加载，即第一次发起ajax请求

34.            blockOpacity: 0.5, //透明度设置

35.            onToggleCol: false, //当在行之间转换时，可在此方法中重写默认实现，基本无用

36.            onChangeSort: false, //当改变排序时，可在此方法中重写默认实现，自行实现客户端排序

37.            onSuccess: false, //成功后执行

38.            onSubmit: false, // 调用自定义的计算函数，基本没用        

39.            //Style

40.            gridClass: "bbit-grid"//样式           

41.        }, p);

另外的两个属性colModel，buttons 不是默认属性，内容说明如下

colModel : 列定义数组  

一个数组，数组的元素说明如下
colModel 参数说明:
display :显示名称
必须设置 ,类型:string, 默认值:无
name :字段名称
必须设置 ,类型:string,默认值:无
width :宽度
必须设置 , 类型:string ,默认值：无
sortable:是否可排序
类型:boolen , 默认值:false
process:处理程序
类型:function ,可格式化单元格
hide :是否隐藏
类型: boolen,默认值：false

buttons : 工具栏Button定义  

一个数组，数组的元素说明如下
buttons 参数说明:
name :Botton的标识
类型:string , 默认值:无
bclass :样式
类型:boolen,默认值:无
onpress :当button被点击时触发的事件
接受button的name为第一个参数，Grid为第二个参数的一个function
separator :是否分隔符
和前面四个属性互斥，当这个属性设置为True时，输出一个分隔符号，不是一个button 默认值:false

参数说明完毕，至于如何使用，那么请参考文中介绍的那篇文章吧？

虽然Flexigrid已然算是优秀，但是问题还是有？比如：

1：如果在列首添加checkbox列（默认不支持），

2：如何给行附加事件（如右键或双击）或者在最后列添加操作列？同时获取该列的数据?

3: 如何能够兼容 jQuery 1.3+?(默认不兼容)

4：如何改善性能问题（IE的脚本执行能力实在是可怜，特别在IE6下，当行列多时，总是有2-3秒的停滞）

5：如何让某列不参与Toggle？