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 }