Ext JS 4: один и тот же контейнер в каждой вкладке - PullRequest
Новая
       33

Ext JS 4: один и тот же контейнер в каждой вкладке

0 голосов
/ 25 января 2012

В настоящее время я использую extjs 4 и у меня есть панель вкладок из 4 вкладок, и я хочу поместить один и тот же контейнер, который содержит две панели инструментов внутри каждой вкладки. Однако всякий раз, когда я пытаюсь это сделать, он только добавляет контейнер на последнюю вкладку и оставляет первые три пустыми. Вот фрагмент моего кода: 

function createTabPanel(config) {
    return new Ext.Panel(Ext.apply({
        region: 'center',
        dockedItems: [
                dateToolbar,
                saveToolbar
        ]
    }, config));
};

var tabPanel = createTabPanel({
});

function createTabContainer(config) {
    return new Ext.Container(Ext.apply({
        height: 500,
        layout: 'border',
        items: tabPanel
    }, config));
};

var tab1Container = createTabContainer({
});

var tab2Container = createTabContainer({
});

var tab3Container = createTabContainer({
});

var tab4Container = createTabContainer({
});

var tabs = new Ext.tab.Panel ({    region: 'center',
title: 'Title:',
activeTab: 0,      // First tab active by default
bodyStyle: 'padding: 5px',
items: [
    {
        title: 'tab1',
        items: tab1container
    },
    {
        title: 'tab2',
        items: tab2container
    },
    {
        title: 'tab3',
        items: tab3container
    },
    {
        title: 'tab4',
        items: tab4container
    }
]
})


displayPanel = new Ext.Panel({
    renderTo : 'box_main',
    border: false,
    items: tabs
});

Я считаю, что мне нужно создать класс и создавать новый объект каждый раз, когда я повторно использую контейнер, но у меня возникают проблемы с его работой. Любая помощь будет отличной Спасибо

РЕДАКТИРОВАТЬ: Добавлен мой контейнер и панель вкладок. удалил id, не исправил. 'dateToolbar' и 'saveToolbar' - это две панели инструментов со списками и кнопками.

Ответы [ 2 ]

3 голосов
/ 25 января 2012

У вас есть один экземпляр tabPanel. Каждый экземпляр компонента может иметь один родительский контейнер. Вы должны изменить вашу createTabContainer функцию следующим образом: 

function createTabContainer(config) {
    return new Ext.Container(Ext.apply({
        height: 500,
        layout: 'border',
        items: createTabPanel({})
    }, config));
};
0 голосов
/ 25 января 2012

Вам нужно показать свой табконтейнер.Но это, вероятно, атрибут id - удалите его.

...