1. 程式人生 > >easyui datagrid 表頭固定(垂直滾動條)、列固定(水平滾動條)

easyui datagrid 表頭固定(垂直滾動條)、列固定(水平滾動條)

easyui datagrid 表頭固定(垂直滾動條)、列固定(水平滾動條),每頁顯示1000行

最近用多了easyui 之後還是覺得它的功能還是很強大的。它原有的功能就已經能夠滿足90%以上的介面需求。

1、當資料行很多時,會呈現垂直的滾動條,但是向下滾動,表頭卻被淹沒了,這不符合人類偷懶的特點(我怎麼可能記得住每列的資料代表的意思!),所以需要固定表頭。

 datagrid.datagrid({
             fit: true

});

對,沒錯,就是這個屬性,就這麼簡單!我也是看了網上的各位大神之後才懂。我看了多遍easyui的api(當然是中文的)沒有!!下次看看英文原版(啊!我的英語水平)。

2、當資料列很多時,會出現水平滾動條。某些列時特定要一直顯示的。

 datagrid.datagrid({
         frozenColumns: [[
                     { field: 'Name', title: '名稱', width: 180 },
        ]]

});

 3、表格預設每頁只顯示幾十行,最多也就50 ,之前遇到一個希望每頁顯示1000行的,說是總是翻頁也很麻煩!好吧,現在我可以隨便滿足你了!

 datagrid.datagrid({
       pageList: [10, 20, 30, 40, 50, 100, 500, 1000],});

 

基本上有些預設引數都是需要的,現在貼上來,免得又忘記(我這記性不好的人啊~~)

  rownumbers: true,
        fit: true,
        idField: ID',
        striped: true,
        singleSelect: true,
        collapsible: true,
        pagination: true,
        pageSize: 500,
        pageList: [10, 20, 30, 40, 50, 100, 500, 1000],