EasyUI datagrid自适应问题解决
在使用js 动态创建EasyUI datagrid时，如果设置fit为true，在显示的时候数据的高度为固定高度不能自适应
解决办法是把fit设为false。
但这样设置后又有个问题，如果把columns定义在js里面，及时宽度设置为百分百，单元格的宽度不能随着浏览器的大小而变化
解决办法是把columns定义在页面html里。
最后的代码如下：
html代码
1 <table id="grid" title="考勤数据" style="width:100%;height:auto"> 2 <thead> 3 <tr> 4 <th field="GUID" hidden="hidden">ID</th> 5 <th field="EmpName" width="20%">姓名</th> 6 <th field="KqDate" width="20%">日期</th> 7 <th field="KqTime" width="20%">时间</th> 8 <th field="IsInvalid" width="16%">是否有效</th> 9 <th field="Remark" width="20%">备注</th> 10 </tr> 11 </thead> 12 </table>
js代码
1 $('#grid').datagrid({ 2 url: '/Checking/GetAll?r=' + Math.random(), //数据接收URL地址 3 iconCls: 'icon-view', //图标 4 fit: false, //自动适屏功能 5 nowrap: true, 6 autoRowHeight: false, //自动行高 7 autoRowWidth: true, 8 striped: true, 9 collapsible: false, 10 remoteSort: true, 11 idField: 'GUID', //主键值 12 pagination: true, //启用分页 13 rownumbers: true, //显示行号 14 multiSort: true, //启用排序 15 sortable: true, //启用排序列 16 fitcolumns: true, 17 queryParams: $("#searchform").form2json(), //搜索条件查询 18 singleSelect: true, 19 /*columns: [[ 20 { field: 'GUID', hidden: true }, 21 { field: 'EmpName', title: '姓名', width: '20%', sortable: true }, 22 { field: 'KqDate', title: '日期', width: '20%', sortable: true }, 23 { field: 'KqTime', title: '时间', width: '20%', sortable: true }, 24 { field: 'IsInvalid', title: '有效否', width: '16%', sortable: true }, 25 { field: 'Remark', title: '备注', width: '20%' } 26 ]],*/ 27 toolbar: '#divtoolbar' 28 }); 29 }
