現(xiàn)在的項(xiàng)目使用Ext2做界面布局以及表格展示，其中遇到的小問(wèn)題及其解決方法記錄下來(lái)，以便大家一起學(xué)習(xí)。

1、Grid滾動(dòng)條

    Grid不顯示水平滾動(dòng)條的辦法：

    在grid創(chuàng)建之后，或grid重新動(dòng)態(tài)配置之后，加入下面兩行代碼即可

    this.grid.getView().mainBody.dom.style.width = this.grid.getView().getTotalWidth();
    this.grid.getView().mainBody.dom.style.height = '1px';

    注：this.grid為創(chuàng)建的grid

   控制滾動(dòng)條位置

   grid.getSelectionModel().selectFirstRow();//第一行   
   grid.getSelectionModel().selectLastRow() ;//最后一行   
   grid.getView().focusRow(grid.getStore().getCount()-1);//指定行

2、讓ExtJs的Grid單元格顯示豎線

Ext GridPanel 的默認(rèn)樣式的單元格沒(méi)有顯示豎線，若要顯示可在頁(yè)面中加入以下CSS樣式：

<style type=“text/css”>
    .x-grid3-cell-inner{
        border-right: 1px solid #eceff6;
    }
</style>

然后發(fā)現(xiàn)豎線與表頭沒(méi)有對(duì)齊，有一個(gè)像素的誤差，再加入樣式，代碼就成了這樣：

<style type=“text/css”>
    /*顯示豎線*/
    .x-grid3-cell-inner{
        border-right: 1px solid #eceff6;
    }
    /*與表頭對(duì)齊*/
    .x-grid3-row td, .x-grid3-summary-row td{
        padding-right: 0px;
    }
</style>

接著發(fā)現(xiàn)行間有一個(gè)像素的間隔，再改吧，代碼如下：

<style type=“text/css”>
    /*顯示豎線*/
    .x-grid3-cell-inner{
        border-right: 1px solid #eceff6;
    }
    /*與表頭對(duì)齊*/
    .x-grid3-row td, .x-grid3-summary-row td{
        padding-right: 0px;
    }
    /*去掉行間空白*/
    .x-grid3-row {
        border-top-width: 0px;
        border-bottom-width: 0px;
    }
</style>

以后會(huì)把遇到的問(wèn)題及其解決方法繼續(xù)添加。。。。