(转载)LigerGrid 参数

公司系统很多地方都用了ligergrid来绑定数据,在调整功能的时候经常发现自己找不到参数表了,昨天找到一个比较全的先转载过来,等以后要用找起来方便些~

----------------------------------------分割线------------------------------------------

来源:http://www.51aspx.com/CodeFile/GYCMSWeb,7636/Manager/lib/ligerUI/js/plugins/ligerGrid.js.html


title: null, //标题

width: 'auto',                          //宽度值
height: 'auto',                          //宽度值
columnWidth: null,                      //默认列宽度
resizable: true,                        //table是否可伸缩
url: false,                             //ajax url
usePager: true,                         //是否分页
page: 1,                                //默认当前页 
pageSize: 10,                           //每页默认的结果数
pageSizeOptions: [10, 20, 30, 40, 50],  //可选择设定的每页结果数
parms: [],                         //提交到服务器的参数
columns: [],                          //数据源
minColToggle: 1,                        //最小显示的列
dataType: 'server',                     //数据源:本地(local)或(server),本地是将读取p.data。不需要配置,取决于设置了data或是url
dataAction: 'server',                    //提交数据的方式:本地(local)或(server),选择本地方式时将在客服端分页、排序。 
showTableToggleBtn: false,              //是否显示'显示隐藏Grid'按钮 
switchPageSizeApplyComboBox: false,     //切换每页记录数是否应用ligerComboBox
allowAdjustColWidth: true,              //是否允许调整列宽     
checkbox: false,                         //是否显示复选框
allowHideColumn: true,                 //是否显示'切换列层'按钮
enabledEdit: false,                      //是否允许编辑
isScroll: true,                         //是否滚动
onDragCol: null,                       //拖动列事件
onToggleCol: null,                     //切换列事件
onChangeSort: null,                    //改变排序事件
onSuccess: null,                       //成功获取服务器数据的事件
onDblClickRow: null,                     //双击行事件
onSelectRow: null,                    //选择行事件
onUnSelectRow: null,                   //取消选择行事件
onBeforeCheckRow: null,                 //选择前事件,可以通过return false阻止操作(复选框)
onCheckRow: null,                    //选择事件(复选框) 
onBeforeCheckAllRow: null,              //选择前事件,可以通过return false阻止操作(复选框 全选/全不选)
onCheckAllRow: null,                    //选择事件(复选框 全选/全不选)
onBeforeShowData: null,                  //显示数据前事件,可以通过reutrn false阻止操作
onAfterShowData: null,                 //显示完数据事件
onError: null,                         //错误事件
onSubmit: null,                         //提交前事件
dateFormat: 'yyyy-MM-dd',              //默认时间显示格式
InWindow: true,                        //是否以窗口的高度为准 height设置为百分比时可用
statusName: '__status',                    //状态名
method: 'post',                         //提交方式
async: true,
fixedCellHeight: true,                       //是否固定单元格的高度
heightDiff: 0,                         //高度补差,当设置height:100%时,可能会有高度的误差,可以通过这个属性调整
cssClass: null,                    //类名
root: 'Rows',                       //数据源字段名
record: 'Total',                     //数据源记录数字段名
pageParmName: 'page',               //页索引参数名,(提交给服务器)
pagesizeParmName: 'pagesize',        //页记录数参数名,(提交给服务器)
sortnameParmName: 'sortname',        //页排序列名(提交给服务器)
sortorderParmName: 'sortorder',      //页排序方向(提交给服务器)
onReload: null,                    //刷新事件,可以通过return false来阻止操作
onToFirst: null,                     //第一页,可以通过return false来阻止操作
onToPrev: null,                      //上一页,可以通过return false来阻止操作
onToNext: null,                      //下一页,可以通过return false来阻止操作
onToLast: null,                      //最后一页,可以通过return false来阻止操作
allowUnSelectRow: false,           //是否允许反选行 
alternatingRow: true,           //奇偶行效果
mouseoverRowCssClass: 'l-grid-row-over',
enabledSort: true,                      //是否允许排序
rowAttrRender: null,                  //行自定义属性渲染器(包括style,也可以定义)
groupColumnName: null,                 //分组 - 列名
groupColumnDisplay: '分组',             //分组 - 列显示名字
groupRender: null,                     //分组 - 渲染器
totalRender: null,                       //统计行(全部数据)
delayLoad: false,                        //初始化时是否不加载
where: null,                           //数据过滤查询函数,(参数一 data item,参数二 data item index)
selectRowButtonOnly: false,            //复选框模式时,是否只允许点击复选框才能选择行
onAfterAddRow: null,                     //增加行后事件
onBeforeEdit: null,                      //编辑前事件
onBeforeSubmitEdit: null,               //验证编辑器结果是否通过
onAfterEdit: null,                       //结束编辑后事件
onLoading: null,                        //加载时函数
onLoaded: null,                          //加载完函数
onContextmenu: null,                   //右击事件
whenRClickToSelect: false,                //右击行时是否选中
contentType: null,                     //Ajax contentType参数
checkboxColWidth: 27,                  //复选框列宽度
detailColWidth: 29,                     //明细列宽度
clickToEdit: true,                      //是否点击单元格的时候就编辑
detailToEdit: false,                     //是否点击明细的时候进入编辑
onEndEdit: null,
minColumnWidth: 80,
tree: null,                            //treeGrid模式
isChecked: null,                       //复选框 初始化函数
frozen: true,                          //是否固定列
frozenDetail: false,                    //明细按钮是否在固定列中
frozenCheckbox: true,                  //复选框按钮是否在固定列中
detailHeight: 260,
rownumbers: false,                         //是否显示行序号
frozenRownumbers: true,                  //行序号是否在固定列中
rownumbersColWidth: 26,
colDraggable: false,                       //是否允许表头拖拽
rowDraggable: false,                         //是否允许行拖拽
rowDraggingRender: null,
autoCheckChildren: true,                  //是否自动选中子节点
onRowDragDrop: null,                    //行拖拽事件
rowHeight: 22,                           //行默认的高度
headerRowHeight: 23,                    //表头行的高度
toolbar: null,                           //工具条,参数同 ligerToolbar的
headerImg: null                        //表格头部图标
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
LigerGrid 是一款功能强大的表格插件,可以接受多种参数配置,以下是一些常用的列表参数: 1. `url`:数据源地址,可以是一个 API 接口地址,也可以是一个 JSON 文件路径; 2. `columns`:定义表格列,是一个数组,每个元素代表一列,包括 `display`(列名)、`name`(字段名)、`width`(列宽度)等属性; 3. `pageSize`:分页大小; 4. `rownumbers`:是否显示行号,默认为 false; 5. `checkbox`:是否显示复选框,默认为 false; 6. `height`:表格高度,可以是一个数字或者百分比; 7. `width`:表格宽度,可以是一个数字或者百分比; 8. `usePager`:是否启用分页,默认为 true; 9. `sortName`:初始化时的排序字段名; 10. `sortOrder`:初始化时的排序方式,可选值为 asc 和 desc。 还有一些其他的参数,如 `toolbar`(工具栏)、`parms`(额外的请求参数)、`onSuccess`(数据请求成功时的回调函数)等,根据实际需求选择使用。 示例代码: ``` $('#grid').ligerGrid({ url: 'data.php', columns: [ { display: 'ID', name: 'id', width: 50 }, { display: '姓名', name: 'name', width: 100 }, { display: '年龄', name: 'age', width: 50 } ], pageSize: 10, rownumbers: true, checkbox: true, height: '100%', width: '100%', usePager: true, sortName: 'id', sortOrder: 'asc', toolbar: { items: [ { text: '添加', click: addButton }, { line: true }, { text: '删除', click: deleteButton } ] }, parms: { param1: 'value1', param2: 'value2' }, onSuccess: function (data) { console.log('数据请求成功,返回数据:', data); } }); ``` 以上是一个简单的 LigerGrid 初始化示例,包括了常用的一些参数配置。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值