DataGrid参数

1.3.2

 

data-options="singleSelect:true,collapsible:false,url:'/datagrid/getbasic'"
参数	类型	说明	默认值及备注
singleSelect	boolean	true:单选　　false:多选	false
collapsible	boolean	true:标题栏显示折叠按钮	false
url	string	数据源　　格式：{"total":3,"rows":[{},{},{}]}
iconCls	string	标题栏左侧图标	icon.css
rownumbers	boolean	是否添加行号	false
frozenColumns	array	这些列固定在左边，不会滚动	用于js生成
fitColumns	boolean	自适应列宽	设置了此项就不要设置width。自动生成滚动条。速度较慢。
striped	boolean	隔行变色	在默认CSS下没有效果
nowrap	boolean	不折行	true
idField	string	主键列
pagination	boolean	分页	false    如果分页，post回传：page=2&rows=10
checkOnSelect	boolean	如果设置为 true，当用户点击一行的时候 checkbox checked(选择)/unchecked(取消选择)。 如果为false，当用户点击刚好在checkbox的时候，checkbox            checked(选择)/unchecked(取消选择)。这个属性从1.3版本以后可用。	true
selectOnCheck	boolean	如果设置为true，点击checkbox将永远选择这行。如果设置为false，选择一个行将不会选择checkbox。这个属性从1.3版本以后可用。	true
pagePosition	string	定义分页工具栏的位置.可用值有： 'top'，'bottom'，'both'。这个属性从1.3版本以后可用。	bottom
pageNumber	number	当设置分页属性时，初始化分页码。	1
pageSize	number	当设置分页属性时，初始化每页记录数。	10
pageList	array	当设置分页属性时，初始化每页记录数列表。	[10,20,30,40,50]
queryParams	object	当请求远程数据时，发送的额外参数。	{}
sortName	string	当数据表格初始化时以哪一列来排序。
sortOrder	string	定义排序顺序，可以是'asc'或者'desc'（正序或者倒序）。	asc
remoteSort	boolean	定义是否显示行底（如果是做统计表格，这里可以显示总计等）。	false
rowStyler	function	返回样式，如：'background:red'，function有2个参数： index：行索引，从0开始. row：对应于该行记录的对象。
loadFilter	function	返回用以显示的已过滤数据，function有一个参数'data'表示原始数据，你可以将原始数据改变为规范的数据格式，该函数必须返回包含 'total'和'rows'属性的标准数据对象。
editors	object	定义当编辑一行时的编辑模式。	predefined editors
view	object	定义数据表格的视图。	default view
autoRowHeight	boolean	定义是否基于某行的内容设置行的高度.设置为false改善加载数据的性能.因为这个操作是在数据加载之后完成的.添加了true会增加加载的时间.	true
toolbar	array,selector	datagrid 顶部的工具栏. 可用值: 1) 一个数组,工具的options(配置项)和linkbutton相同. 2) 一个选择器指定工具栏. 定义工具栏 在div标签:   $('#dg').datagrid({ toolbar: '#tb' });< div id="tb">< a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true"/a>< a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help',plain:true"/a>< /div> 通过数组定义工具栏: $('#dg').datagrid({ toolbar: [{ iconCls: 'icon-edit', handler: function(){alert('edit')} },'-',{ iconCls: 'icon-help', handler: function(){alert('help')} }] });
method	string	加载远程服务器数据的请求方法类型.	post
loadMsg	string	当从远程服务器加载数据的时候,显示的提示消息.	Processing, please wait …
showHeader	boolean	定义是否显示行标题 .	true
showFooter	boolean	定义是否显示行页脚.　　格式：{"total":3,"rows":[{},{},{}],"footer":[{},{}]}	false
scrollbarSize	number	定义滚动条宽度 (当滚动条是垂直的时候) 或者高度(当滚动条是水平的时候).	18
onLoadSuccess	function	数据加载完成后调用的方法 可以在这里固定行： onLoadSuccess: function(){      $(this).datagrid('freezeRow',0).datagrid('freezeRow',1);     }
rowStyler	function	rowStyler: function(index,row){      if (row.swbm_dm == '21308000005' ){       return 'background-color:#6293BB;color:#fff;font-weight:bold;';      } }
<th data-options="field:'swjg_dm',width:80,align:'center'">swjg_dm</th>
field		字段名称
width		宽度
align		水平对齐方式
halign		表头字符对齐方式
styler:cellStyler		通过调用方法设置本字段某些单元格特殊样式	<script type="text/javascript">   function cellStyler(value,row,index){    if (value < 30){     return 'background-color:#ffee00;color:red;';    }   }  </script>
formatter:formatPrice	function	function formatPrice(val,row){    if (val < 30){     return '<span style="color:red;">('+val+')</span>';    } else {     return val;    }   }
rowspan
colspan
resizable
hidden
checkbox
styler
editor
固定左侧列 如果grid的宽高采用的是自适应，也就是设置了fit和fitColumns，那么grid列的width就不要设置了.否则可能冻结列设置没有效果   <thead frozen="true">  或　　data-options="frozen:true" <thead frozen="true">         <tr>             <th data-options="field:'ck',checkbox:true"></th>         </tr>     </thead>     <thead>         <tr>             <th data-options="field:'swjg_dm',width:80,align:'center',styler:cellStyler">swjg_dm</th>             <th data-options="field:'swjg_mc',width:200,align:'left'">swjg_mc</th>             <th data-options="field:'swbm_dm',width:80,align:'center'">swbm_dm</th>             <th data-options="field:'swbm_mc',width:150,align:'left'">swbm_mc</th>             <th data-options="field:'sj_swjg_dm',width:80,align:'center'">sj_swjg_dm</th>             <th data-options="field:'xybz',width:60,align:'center'">xybz</th>         </tr> </thead>