EasyUI 之datagrid 使用

来源：互联网发布：淘宝深度流量互踩编辑：程序博客网时间：2024/05/17 15:58

可选的参数

DataGrid 属性

覆写了 $.fn.datagrid.defaults.

参数名类型描述默认值titlestring Datagrid面板的标题nulliconClsstring 在面板上通过一个CSS类显示16x16图标。nullborderboolean 设置面板是否具有边框truewidthnumber datagrid面板的宽度autoheightnumber datagrid面板的高度autocolumnsarray DataGrid列配置对象nullfrozenColumnsarray 冻结的列，被现实在左边nullstripedboolean 设置是否让单元格显示条纹。默认false。falsemethodstring 通过该方法类型请求远程数据。默认post。postnowrapboolean 是否包裹数据，默认为包裹数据显示在一行trueidFieldstring 标识字段，或者说主键字段nullurlstring 请求数据的URL.nullloadMsgstring 加载数据时显示的信息Processing, please wait …paginationboolean 是否显示分页工具栏falserownumbersboolean 是否显示行号falsesingleSelectboolean 是否单选falsefitboolean 是否自动适应父容器falsepageNumbernumber 分页初始化行号1pageSizenumber 初始化分页大小10pageListarray 分页大小选择列[10,20,30,40,50]queryParamsobject 请求数据时额外发送的参数{}sortNamestring 排序列nullsortOrderstring 升序还是降序 'asc' 或者 'desc'.asc

Column 属性

DataGrid Columns 是一个数组对象, 数组里的对象也是一个数组，数组里的每一个小对象就是一个列字段，例如：

columns:[[    {field:'itemid',title:'Item ID',rowspan:2,width:80,sortable:true},    {field:'productid',title:'Product ID',rowspan:2,width:80,sortable:true},    {title:'Item Details',colspan:4}],[    {field:'listprice',title:'List Price',width:80,align:'right',sortable:true},    {field:'unitcost',title:'Unit Cost',width:80,align:'right',sortable:true},    {field:'attr1',title:'Attribute',width:100},    {field:'status',title:'Status',width:60}]]

名称类型
描述默认值
titlestring列字段要现实的名称undefinedfieldstring列字段undefinedwidthnumber宽度undefinedrowspannumber单元格行数undefinedcolspannumber单元格列数undefinedalignstring文本对齐方式，同align属性.undefinedsortableboolean是否可以被排序.undefinedcheckboxboolean是否具有多选框undefined

Events（事件）

NameParametersDescriptiononLoadSuccessnone调用远程数据成功是激活onLoadErrornone装载错误时激活onClickRowrowIndex, rowData点击一行时激活，参数包括：
rowIndex:点击的行数，从0开始
rowData: 当前行的数据onDblClickRowrowIndex, rowData双击一行是触发，参数包括:
rowIndex:点击的行数，从0开始
rowData: 当前行的数据onSortColumnsort, order对一列进行排序时激活,参数包括:
sort:排序字段名称
order: 排序规则，升序，降序onSelectrowIndex, rowData选中一行时激活，参数有:
rowIndex:选中的行数
rowData: 数据onUnselectrowIndex, rowData取消选中时激活，参数：
rowIndex:选中的行数
rowData: 数据

Methods（方法）

NameParameterDescriptionoptionsnone返回所有属性resizenone重置大小布局reloadnone重新加载数据fixColumnSizenone调整列的大小loadDataparam装载数据，以前的数据会被移除getSelectednone返回选中的行，没有则返回空getSelectionsnone返回所有的行，空则返回空数组clearSelectionsnone取消所有选中selectRowindex选中一行，参数为行号selectRecordidValue根据主键查询出一条记录unselectRowindex取消选中一行

0 0