找了快1個(gè)小時(shí)，就是不知道錯(cuò)誤在哪里。。。郁悶
我在鼠標(biāo)左側(cè)點(diǎn)擊tree節(jié)點(diǎn)，在右側(cè)創(chuàng)建一個(gè)標(biāo)簽頁(yè)，這個(gè)已經(jīng)能夠?qū)崿F(xiàn)，于是我再在新建的標(biāo)簽頁(yè)里嵌套一個(gè)Grid。
奇怪的問(wèn)題出現(xiàn)了。。
FF和IE下都沒(méi)報(bào)錯(cuò)。但是Grid就是不顯示。本來(lái)我以為我代碼錯(cuò)誤。于是我狂找我的代碼問(wèn)題，無(wú)意中關(guān)掉FF的firbug插件界面，grid就現(xiàn)實(shí)出來(lái)了。。。原來(lái)只要我的窗口發(fā)生任何變化Grid才會(huì)顯示出來(lái)。
請(qǐng)問(wèn)這是我代碼問(wèn)題還是bug？如何解決？
補(bǔ)充一下，我直接在TabPanel里面用items管理grid對(duì)象并沒(méi)問(wèn)題。但是我用添加事件后在其中管理就出問(wèn)題了。
文件都是封裝在類包里面的。所以只貼關(guān)鍵部分
這是監(jiān)聽(tīng)事件。
Java代碼
listeners:{
'click':function(node, event) {
event.stopEvent();
//把根節(jié)點(diǎn)的選擇判斷去除
if(node.text=="SamPeng" || node.text == "文章管理" || node.text == "產(chǎn)品管理" || node.text == "信息管理" || node.text == "來(lái)訪管理"){
}else{
var n = main.getComponent(node.id);
if (!n) { //判斷是否已經(jīng)打開(kāi)該面板
//如果是按的文章列表，新建一個(gè)列表對(duì)象并且丟進(jìn)新的標(biāo)簽頁(yè)
if(node.text == "文章列表"){
var grid=new SamPeng.account.list();
n = main.add({
'id':node.id,
'title':node.text,
items: [{layout:"fit",items:grid}]
});}
}
main.setActiveTab(n);
}
}
listeners:{
                'click':function(node, event) {
                         event.stopEvent();
                        //把根節(jié)點(diǎn)的選擇判斷去除
                        if(node.text=="SamPeng" || node.text == "文章管理" || node.text == "產(chǎn)品管理" || node.text == "信息管理" || node.text == "來(lái)訪管理"){
                        }else{
                            var n = main.getComponent(node.id);
                            if (!n) { //判斷是否已經(jīng)打開(kāi)該面板
                                    //如果是按的文章列表，新建一個(gè)列表對(duì)象并且丟進(jìn)新的標(biāo)簽頁(yè)
                                if(node.text == "文章列表"){
                                    var grid=new SamPeng.account.list();
                                    n = main.add({
                                    'id':node.id,
                                    'title':node.text,
                                     items: [{layout:"fit",items:grid}]
                                });}
                            }
                         main.setActiveTab(n);
                            }
                        }
然后是我的tab面板創(chuàng)建類
Java代碼
* Copyright(c) 2008-2010, SamPeng Inc.
*/
package("SamPeng.panel");
/**
* 作用: 用來(lái)創(chuàng)建中間的主顯示面板
* 作者：SamPeng
* 時(shí)間：2008年9月24日1:24:42
*/
SamPeng.panel.main = function(config){
var config=config || {};
var deconfig={
renderTo:'mainlay',
width:1000,
height:561,
activeTab:0,
plain: true,
border: true,
tabPosition: 'top',
frame: true,
autoScroll: true,
enableTabScroll:true,//超過(guò)寬度就自動(dòng)兩邊多出滾動(dòng)條
items:[{
title:"首頁(yè)"
}
]
}
Ext.applyIf(config,deconfig);
SamPeng.panel.main.superclass.constructor.call(this,config);
}
Ext.extend(SamPeng.panel.main,Ext.TabPanel);
* Copyright(c) 2008-2010, SamPeng Inc.
*/
package("SamPeng.panel");
/**
* 作用: 用來(lái)創(chuàng)建中間的主顯示面板
* 作者：SamPeng
* 時(shí)間：2008年9月24日1:24:42
*/
    SamPeng.panel.main = function(config){

        var config=config || {};
        var deconfig={
                    renderTo:'mainlay',
                    width:1000,
                    height:561,
                    activeTab:0,
                    plain: true,
                    border: true,
                    tabPosition: 'top',
                    frame: true,
                    autoScroll: true,
                    enableTabScroll:true,//超過(guò)寬度就自動(dòng)兩邊多出滾動(dòng)條
                 items:[{
                                title:"首頁(yè)"
                            }
                         ]            
                    }
        Ext.applyIf(config,deconfig);
        SamPeng.panel.main.superclass.constructor.call(this,config);
     }
    Ext.extend(SamPeng.panel.main,Ext.TabPanel);
Grid的就只貼數(shù)據(jù)源和屬性的了。
Java代碼
/*******************************************************
* 為表格建立數(shù)據(jù)源
* 鏈接后臺(tái)，并且按每一頁(yè)的數(shù)據(jù)列表返回
* 用Json數(shù)據(jù)格式傳遞
*******************************************************/
this.dataStore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'php/article_list.php',
disableCaching:false
}),
reader: new Ext.data.JsonReader({
root: 'results',
totalProperty: 'total',
id:'id'
},[
{name: 'id'},
{name: 'name'},
{name: 'typename'},
{name: 'time'},
])
});
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
。。。
。。。省略很多
。。。
/*******************************************************
* 構(gòu)造編輯列表面板（GridPanel）
*******************************************************/
SamPeng.account.list.superclass.constructor.call(this, {
id: 'list-account-panel',
ds: this.dataStore,
cm: art_cm,
sm: selectBoxModel,
height:500,
tbar: pagingbar,
bbar: menubar,
loadMask: {msg: '讀取數(shù)據(jù)中 ...'},
enableColumnHide: false,
autoScroll:true
//region:'center'
});
Ext.extend(SamPeng.account.list, Ext.grid.GridPanel, {
reload : function() {
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
},
// 調(diào)用刪除數(shù)據(jù)
// 服務(wù)器通過(guò)接受參數(shù)返回刪除的數(shù)據(jù)
deleteData : function (jsonData) {
this.dataStore.load({params:{start:0, limit:this.myPageSize, delData:jsonData}});
}

        /*******************************************************
        * 為表格建立數(shù)據(jù)源
        *     鏈接后臺(tái)，并且按每一頁(yè)的數(shù)據(jù)列表返回
        *    用Json數(shù)據(jù)格式傳遞
        *******************************************************/
        this.dataStore = new Ext.data.Store({
            proxy: new Ext.data.HttpProxy({
             url: 'php/article_list.php',
             disableCaching:false
            }),

            reader: new Ext.data.JsonReader({
                root: 'results',
                totalProperty: 'total',
                id:'id'
            },[
             {name: 'id'},
             {name: 'name'},
             {name: 'typename'},
             {name: 'time'},
            ])
        });
        this.dataStore.load({params:{start:0, limit:this.myPageSize}});    
。。。
。。。省略很多
。。。
        /*******************************************************
        * 構(gòu)造編輯列表面板（GridPanel）
        *******************************************************/
        SamPeng.account.list.superclass.constructor.call(this, {
                id: 'list-account-panel',
                ds: this.dataStore,
                cm: art_cm,    
                sm: selectBoxModel,
                height:500,
                tbar: pagingbar,
                bbar: menubar,
                loadMask: {msg: '讀取數(shù)據(jù)中 ...'},
                enableColumnHide: false,
                autoScroll:true
                //region:'center'
        });
Ext.extend(SamPeng.account.list, Ext.grid.GridPanel, {
reload : function() {
        this.dataStore.load({params:{start:0, limit:this.myPageSize}});    
    },
// 調(diào)用刪除數(shù)據(jù)
// 服務(wù)器通過(guò)接受參數(shù)返回刪除的數(shù)據(jù)
deleteData : function (jsonData) {
    this.dataStore.load({params:{start:0, limit:this.myPageSize, delData:jsonData}});
}    
謝謝各位大俠了！
問(wèn)題狀況是我瀏覽器不動(dòng)，Grid死活不顯示，瀏覽器一變，Grid就出來(lái)了。而且是按照我設(shè)定的參數(shù)大小顯示的。不明白倒底問(wèn)題出在哪里。只有這么多分了。望指教

本來(lái)以為是代碼有問(wèn)題，看Firebug沒(méi)有報(bào)錯(cuò)，并且觀察Firebug確實(shí)從服務(wù)端取得了數(shù)據(jù)。搞了很久沒(méi)有想出問(wèn)題，但是什么也不干，把窗口最小化再最大化的時(shí)候，數(shù)據(jù)又出來(lái)了！??！
這可能是Extjs的一個(gè)Bug，從網(wǎng)上找類似的解決方法，找到了這個(gè)：
，后來(lái)又和qiuye402大俠進(jìn)行了溝通終于搞定。

其實(shí)就是布局刷新的問(wèn)題，只需將最外層的容器重新render一下就可以了。最外層的容器一般就是類似于viewport的東東了，剛開(kāi)始不知道，一直重新render包含grid的panel，沒(méi)有效果，重新render viewport一切OK了！

最新評(píng)論