ExtJS 3.4: как динамически изменять размер набора полей

Я пытаюсь добавить элемент в fielset динамически. Я проверил элементы набора полей в консоли, элемент добавляется в набор полей, но не отображается, я вызываю метод doLayout() для набора полей, а также для formpanel, который имеет этот набор полей, но размер/ высота набора полей не меняется. Может ли кто-нибудь помочь мне с этой проблемой?

 if(csType.value=="OS"){
            Ext.apply(newOs,that.osCombo);
            newOs.id = 'testOs2';
            Ext.getCmp('cSFieldSet').add(newOs);
            Ext.getCmp('cSFieldSet').setHeight(600);
            Ext.getCmp('cSFieldSet').doLayout(true,true);
            Ext.getCmp('cSFieldSet').ownerCt.doLayout(true,true);
            that.csFormPanel.doLayout(true,true);
        }

Я также пытался использовать autoHeight: true, но элемент все равно не отображается


person user777777    schedule 18.02.2015    source источник
comment
Вы также можете опубликовать свой код formpanel   -  person mindparse    schedule 18.02.2015


Ответы (1)


Вот некоторый тестовый код, который я только что написал, чтобы имитировать то, чего вы пытаетесь достичь:

var simple = new Ext.FormPanel({
            labelWidth: 75, 
            frame:true,
            title: 'Simple Form',
            bodyStyle:'padding:5px 5px 0',
            width: 350,
            defaults: {width: 230},
            defaultType: 'textfield',

            items: [{
                // Fieldset in Column 1
                xtype:'fieldset',
                itemId: 'fieldSetTest',
                columnWidth: 0.5,
                title: 'Fieldset 1',
                collapsible: false,
                autoHeight:false,
                defaultType: 'textfield',
                items :[{
                        fieldLabel: 'Field 1'
                    }, {
                        fieldLabel: 'Field 2'
                    }, {
                        fieldLabel: 'Field 3'
                    }
                ]
            }
            ],

            buttons: [{
                text: 'Add New Field',
                handler: function() {
                    var newItem = new Ext.form.TextField({fieldLabel: 'New Fields'});
                    simple.getComponent('fieldSetTest').add(newItem);
                    simple.doLayout();
                },
                scope:this
            }]
        });

        simple.render(document.body);

    });

Это работает нормально, поэтому при нажатии кнопки добавления в наборе полей появляется новый элемент, и высота набора полей автоматически увеличивается. Не видя всего вашего кода formpanel, я не могу комментировать дальше.

person mindparse    schedule 18.02.2015
comment
Спасибо .. это сработало отлично. а как удалить компонент? Я попробовал что-то вроде этого simple.getComponent('fieldSetTest').remove(newItem);, и это не сработало. - person user777777; 18.02.2015
comment
@Shruti try fieldset.remove(Ext.getCmp('componentIdToRemove')) Не уверен, что Ext.getCmp существует в версии 3.4, но используйте все, что позволяет вам получить доступ к компоненту ExtJS. - person Francis Ducharme; 19.02.2015
comment
Если вы установите itemId для каждого из элементов набора полей, вы можете выполнить fieldset.remove(fieldset.getComponent('itemIdhere')). Возможно, вы даже могли бы сделать fieldset.getComponent('itemIdHere').destroy() - person mindparse; 19.02.2015