ExtJSフレームワークを使用して構築されたWebアプリがあります。
西のパネルには木があり、中央のパネルには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機能を使用しなくても(たとえば、タブが1つしかない場合)、フォームは正しく機能し、タブが正しく削除/再追加された状態でノード間を移動できます。
ただし、Ctrlキーを押しながらノードをクリックして2番目のタブを開くと、最初はタブが開くので2つのタブがありますが、別のノードを選択すると(つまり、最近追加した2番目のタブを削除して、新しいノードの新しいタブ)2番目のタブを閉じるだけですが、新しいタブの追加に失敗します。
タブが1つしかないのにタブを追加/削除しているので、その背後にある理由はわかりません。
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]
-----------更新: --------------
これはdoLayout()呼び出しと相関しているようです-remove()呼び出しの直後にdoLayout()呼び出しを配置すると、add()呼び出しほど太くなりません。また、.add()の後に配置すると次に呼び出すと、新しいタブが半分読み込まれますが、完了する前に停止します。
両方の後にdoLayout()呼び出しがある場合、それは少し良く機能し、2つの機能するタブを持つことができますが、3番目のタブを追加しようとすると、上記と同じ動作が表示され、3番目のタブが閉じて新しいものを再開しません。