Панель Extjs с большими сложными объектами или динамически загружаемыми объектами - PullRequest
Новая
       8

Панель Extjs с большими сложными объектами или динамически загружаемыми объектами

0 голосов
/ 14 июля 2011

У меня есть проблемы со сложными объектами на вкладке. У меня есть 2 сложных объекта с магазинами, окнами, сетками, деревьями и т. Д. Вот начало объекта: 

Ext.define('Ext.app.DocumentsContainer', {

    extend: 'Ext.container.Container',   

    initComponent: function(){

        var documentsStore = Ext.create('Ext.data.Store', {

И у меня есть tabpanel с 2 панелями (по одной на каждый объект). полный код окна просмотра с табульной панелью: 

Ext.create('Ext.container.Viewport', {
        layout: 'border',
        padding: '5',
        items: [
            {
                xtype: 'container',
                region: 'north',
                height: 50
            },
            {
                xtype: 'tabpanel',
                activeTab: 0,
                region: 'center',
                width: 100,
                items: [
                {
                    xtype: 'panel',
                    title: 'Documents',
                    layout: 'border',
                    items: Ext.create('Ext.app.DocumentsContainer'),
                },{
                    xtype: 'panel',
                    title: 'Transmittals',
                    layout: 'border',
                    items: [Ext.create('Ext.app.TransmittalsContainer')],
                }]
            }
        ],
    });

Когда я тестирую свою страницу, возникает проблема, потому что каким-то образом данные из одного объекта отображаются в сетке в другом объекте или вообще не отображаются. Но оба объекта работают правильно по одному. Я думаю, я могу исправить это, динамически загружая объекты, когда вкладка открыта, но не знаю, как я могу это сделать. Есть предложения?

Ответы [ 2 ]

2 голосов
/ 14 июля 2011

Не зная внутренностей ваших двух компонентов Ext.app.DocumentsContainer и Ext.app.TransmittalsContainer, невозможно однозначно ответить на ваш вопрос. Возможно, вы назначаете один и тот же идентификатор двум разным внутренним компонентам - это чаще всего причина смешанных данных.

Во-вторых, Фредерик прав - вы перегружаете свои компоненты. Обе панели внутри tabpanel не нужны, потому что вы можете поместить свои компоненты непосредственно в tabpanel, как показано Frederic . Однако, если вы настаиваете на сохранении своих панелей, попробуйте изменить layout на fit, потому что этот тип макета обрабатывает компоненты одного элемента (размер одного компонента соответствовал родительскому фрейму).

2 голосов
/ 14 июля 2011

Вы перебираете табульную панель.Элементы вкладок автоматически растягивают свое содержимое.Так что это может сработать для вас.

Сделайте это вместо этого.Измените DocumentContainer на панель pe (чтобы он мог иметь заголовок). 

Ext.define('Ext.app.DocumentsContainer', {

    extend: 'Ext.panel.Panel',   

    initComponent: function(){

        var documentsStore = Ext.create('Ext.data.Store', {

И измените вашу панель вкладок на эту.Я также удалил ширину в вашей центральной области.Центральные области автоматически заполняют оставшуюся часть макетов. 

Ext.create('Ext.container.Viewport', {
        layout: 'border',
        padding: '5',
        items: [
            {
                xtype: 'container',
                region: 'north',
                height: 50
            },
            {
                xtype: 'tabpanel',
                activeTab: 0,
                region: 'center',
                items: [
                    Ext.create('Ext.app.DocumentsContainer', {title:'Documents'}),
                    Ext.create('Ext.app.TransmittalsContainer', {title:'Transmittals'})
                ]
            }
        ],
    });

Также.как упомянул Стефан.Никогда не используйте идентификаторы в вашем коде ExtJS4.Они злые и в конечном итоге ухудшат ваш результат.ItemId или просто Ext.DomQuery это способ сделать это.

...