2011-05-11 61 views
1

我有一個使用ExtJS框架構建的Web應用程序。添加和刪除內容到tabPanel時出錯 - ExtJs

我在我的西面板中有一棵樹,在中間面板上有一個TabPanel。當我點擊任何在它試圖添加到中心的TabPanel形式西部面板中的樹節點,下面的代碼被稱爲:

var center = Ext.getCmp("center-panel"); 

var existingpanel = center.get(panelId); 
if (existingpanel) { 
    center.setActiveTab(existingpanel); 
} else { 

    var activeTab = center.getActiveTab(); 

    if (!openNew && activeTab) { 
     var removed = center.remove(activeTab, true); 
    } 

     center.add(c); 
     center.setActiveTab(panelId); 
     center.doLayout(); 

} 

這檢索當前組件,然後檢查看看我們試圖加載的標籤是否存在,如果它確實存在,那麼它只是激活該標籤,否則它會嘗試添加一個新標籤。 OpenNew只是一個傳入的狀態來表明它是否應該在新選項卡中打開(例如,如果用戶按Ctrl +單擊樹上的節點)。

如果沒有使用OpenNew功能(例如只有一個選項卡),表單可以正常工作,並且我可以在節點之間導航,並且正確刪除/重新添加標籤。但是,如果我按Ctrl +單擊一個節點打開第二個選項卡,該選項卡首先打開,所以有兩個選項卡,但是當我選擇另一個節點時(所以這應該只是刪除最近添加的第二個選項卡和將它替換爲新節點的新選項卡),它只是關閉第二個選項卡,但未能添加新選項卡。

我看不到任何背後的原因,因爲它是fien添加/刪除標籤時,只有一個標籤。

有在Firebug的錯誤,但它並沒有提供太多的幫助:

uncaught exception: [Exception... "Could not convert JavaScript argument arg 0 [nsIDOM3Node.compareDocumentPosition]" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: /ext/ext-3.1.1/adapter/ext/ext-base-debug.js?d=1066331810 :: <TOP_LEVEL> :: line 1900" data: no] 

----------- UPDATE: -------- ------

它似乎與doLayout()調用相關 - 如果我在remove()調用後直接放置doLayout()調用,那麼它不會像add()調用那樣胖,並且如果我將它放在.add()調用之後,則它會加載新的選項卡,但在完成之前停止。

如果我在兩者之後都有doLayout()調用,那麼它會更好一些,然後我可以有兩個功能選項卡,但是當我嘗試添加第三個選項卡時,它顯示與上面相同的行爲,並關閉第三個選項卡並沒有重新打開一個新的..

+0

現在想不到任何東西..如果您按住ctrl-click重複(打開多個選項卡)會發生什麼?你使用的是什麼版本的分機,發佈一個jsfiddle示例可能會有所幫助。你確認代碼到達center.add(c)位了嗎? – Jad 2011-05-11 16:01:08

+0

繼續按Ctrl + click成功添加更多選項卡 - 它似乎開始出現錯誤,一旦打開多個選項卡調用remove()函數(如果打開多個選項卡,然後使用選項卡標題上的關閉按鈕關閉一個我也會遇到類似的問題 – rhinds 2011-05-11 16:04:56

+1

你是否檢查ID衝突?(多個EXT組件聲明相同的ID屬性) – Jad 2011-05-11 16:08:33

回答

1

我現在已經解決了這個問題 - 問題是與我實際添加的formPanels,而所有的面板本身都有唯一的ID我沒有想過檢查表單中的其他組件的ID(如Jad在他的評論中所建議的),並且表單具有用靜態ID定義的「FieldSets」,從而消除了解決問題的那些。

我也使用開發人員工具在Chrome中測試了這個問題,發現堆棧跟蹤比FireBug提供的錯誤更有用,所以我將從現在開始使用這兩種方法!