#javascript #extjs #tabpanel
#javascript #extjs #tabpanel
Вопрос:
У меня есть веб-приложение, созданное с использованием ExtJS framework.
У меня на западной панели есть дерево, а на центральной панели — панель вкладок. Когда я нажимаю на любой из узлов дерева на западной панели, он пытается добавить форму на центральную панель вкладок, вызывается следующий код:
var center = Ext.getCmp("center-panel");
var existingpanel = center.get(panelId);
if (existingpanel) {
center.setActiveTab(existingpanel);
} else {
var activeTab = center.getActiveTab();
if (!openNew amp;amp; activeTab) {
var removed = center.remove(activeTab, true);
}
center.add(c);
center.setActiveTab(panelId);
center.doLayout();
}
При этом извлекается текущий компонент, а затем проверяется, существует ли вкладка, которую мы пытаемся загрузить, если она существует, то она просто активирует эту вкладку, в противном случае она попытается добавить новую.
OpenNew — это просто флаг, который передается, чтобы указать, следует ли открывать его на новой вкладке (например, если пользователь нажмет ctrl на узел в дереве).
Без использования функциональности OpenNew (например, только с одной вкладкой) форма работает корректно, и я могу перемещаться между узлами с корректно удаляемыми / повторно добавляемыми вкладками.
Однако, если я нажимаю ctrl на узел, чтобы открыть вторую вкладку, сначала открывается вкладка, поэтому есть две вкладки, но затем, когда я выбираю другой узел (так что это должно просто удалить недавно добавленную вторую вкладку и заменить ее новой вкладкой для нового узла), он просто закрывает вторую вкладку, но не добавляет новую вкладку.
Я не вижу никакой причины за этим, поскольку это связано с добавлением / удалением вкладок, когда есть только одна вкладка.
В 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() — если я помещаю вызов doLayout () непосредственно после вызова remove (), то он не становится таким толстым, как вызов add (), а если я помещаю его после вызова .add(), то он наполовину загружает новую вкладку, но останавливается перед завершением.
Если у меня есть вызов doLayout () после обоих, то это работает немного лучше, и тогда у меня могут быть две функционирующие вкладки, но когда я попытался добавить третью вкладку, она отображает то же поведение, что и выше, и закрывает третью вкладку и не открывает новую повторно..
Комментарии:
1. Прямо сейчас ничего не могу придумать.. Что произойдет, если вы нажмете ctrl несколько раз (чтобы открыть несколько вкладок)? Какую версию ext вы используете, и публикация примера jsfiddle может помочь. Вы подтвердили, что код попадает в бит center.add (c)?
2. продолжение нажатия ctrl успешно добавляет больше вкладок — кажется, что все начинает идти не так только после вызова функции remove () при открытии нескольких вкладок (если открыть несколько вкладок, а затем закрыть одну с помощью кнопки закрытия в заголовке вкладки, я также получаю похожие проблемы.
3. Вы проверили наличие конфликтов идентификаторов? (несколько внешних компонентов объявляют одно и то же свойство id)
4. Тогда был бы хорош пример jsFiddle. Возможно, вы могли бы попробовать настроить узлы, которые добавляют чрезвычайно простую вкладку, чтобы проверить, не сработает ли destroy / add неправильно из-за сложного компонента.
Ответ №1:
Теперь я решил эту проблему — проблема была связана с панелями форм, которые я фактически добавлял, в то время как все сами панели имели уникальные идентификаторы, я не подумал проверить идентификаторы других компонентов в форме (как предлагает Джад в своих комментариях), а формы имели «Наборы полей», определенные со статическими идентификаторами, удаление которых решило проблемы.
Я также протестировал проблему в Chrome с помощью инструментов разработчика и обнаружил, что трассировка стека намного полезнее, чем ошибка, вызванная FireBug, поэтому с этого момента я буду использовать оба!