0

我有一个模态面板,包括几个字段。其中两个字段位于表单的底部。当用户单击一个按钮时,我想在最后一个字段下方再添加一个字段块。因此,我需要知道字段集中使用的窗口大小和总组件。

我的问题是,我们如何计算指定区域中的组件( xtype's )?就我而言,一个字段集(当用户单击LEVEL EKLE按钮时)。

winArticle = new Ext.Window({
width: 600,
modal: true,
title: 'Artikel Seçimi',
closeAction: 'hide',
bodyPadding: 10,
items: new Ext.Panel({
    items: [
        {
            xtype: 'fieldset',
            title: 'Artikel Sorgulama',
            defaultType: 'textfield',
            layout: 'anchor',
            defaults: {
                anchor: '100%'
            },
            height: '76px',
            items: [
                {
                    xtype: 'fieldcontainer',
                    layout: 'hbox',
                    defaultType: 'textfield',
                    items: [
                        {
                            xtype: 'combobox',
                            id: 'articleNo',
                            inputWidth: 320,
                            fieldLabel: 'ARTİKEL NO',
                            fieldStyle: 'height: 26px',
                            margin: '10 15 0 0',
                            triggerAction: 'query',
                            pageSize: true
                        },
                        {
                            xtype: 'button',
                            text: 'SORGULA',
                            width: 100,
                            scale: 'medium',
                            margin: '8 0 0 0'
                        }
                    ]
                }
            ]
        },
        {
            xtype: 'fieldset',
            title: 'Artikel Bilgileri',
            height: '140px',
            layout: 'fit',
            items: [
                {
                    xtype: 'fieldcontainer',
                    layout: 'hbox',
                    defaultType: 'textfield',
                    fieldDefaults: {
                        labelAlign: 'top'
                    },
                    items: [
                        {
                            fieldLabel: 'ARTİKEL TANIMI',
                            name: 'artDesc',
                            flex: 3,
                            margins: '0 5 0 0'
                        },
                        {
                            fieldLabel: 'PAKET İÇERİĞİ',
                            name: 'artgebi',
                            flex: 1
                        }
                    ]
                },
                {
                    xtype: 'fieldcontainer',
                    layout: 'hbox',
                    defaultType: 'textfield',
                    fieldDefaults: {
                        labelAlign: 'top'
                    },
                    items: [
                        {
                            fieldLabel: 'SUBSYS',
                            name: 'artSubsys',
                            flex: 1,
                            margins: '0 5 0 0'
                        },
                        {
                            fieldLabel: 'VARIANT',
                            name: 'artVariant',
                            flex: 1,
                            margins: '0 5 0 0'
                        },
                        {
                            fieldLabel: 'VARIANT TANIMI',
                            name: 'artVariantDesc',
                            flex: 2
                        }
                    ]
                }
            ]
        },
        {
            xtype: 'fieldset',
            title: 'Aksiyon Seviyeleri',
            id: 'article-fieldset',
            items: [
                {
                    xtype: 'button',
                    text: 'LEVEL EKLE',
                    scale: 'medium',
                    width: 100,
                    style: 'float: right',
                    margin: '0 7 0 0',
                    handler: function() {
                        var count = Ext.query('#article-fieldset');
                        console.log(count);
                        winArticle.setHeight(500);
                        Ext.getCmp('article-fieldset').add([
                            {
                                xtype: 'fieldcontainer',
                                layout: 'hbox',
                                defaultType: 'textfield',
                                fieldDefaults: {
                                    labelAlign: 'top'
                                },
                                items: [
                                    {
                                        flex: 2,
                                        name: 'artLevel2',
                                        allowBlank: false,
                                        fieldStyle: 'text-align: right; font-size: 13pt; background-color: #EAFFCC;',
                                        margins: '0 5 0 0'
                                    },
                                    {
                                        flex: 2,
                                        name: 'artValue2',
                                        allowBlank: false,
                                        fieldStyle: 'text-align: right; font-size: 13pt; background-color: #EAFFCC;'
                                    }
                                ]
                            }
                        ]);
                    }
                },
                {
                    xtype: 'fieldcontainer',
                    layout: 'hbox',
                    id: 'article-level-container',
                    defaultType: 'textfield',
                    fieldDefaults: {
                        labelAlign: 'top'
                    },
                    items: [
                        {
                            fieldLabel: 'LEVEL',
                            name: 'artLevel',
                            flex: 2,
                            margins: '0 5 0 0',
                            allowBlank: false,
                            fieldStyle: 'text-align: right; font-size: 13pt; background-color: #EAFFCC;'
                        },
                        {
                            fieldLabel: 'VALUE',
                            name: 'artValue',
                            flex: 2,
                            allowBlank: false,
                            blankText: 'zorunlu alan, boş bırakılamaz',
                            fieldStyle: 'text-align: right; font-size: 13pt; background-color: #EAFFCC;',
                            listeners: {
                                change: function(textfield, newValue, oldValue) {
                                    if(oldValue == 'undefined' || newValue == '') {
                                        Ext.getCmp('btnArticleSave').disable();
                                    } else {
                                        Ext.getCmp('btnArticleSave').enable();
                                    }
                                }
                            }
                        }
                    ]
                }
            ]
        }
    ]
}),
buttons: [
    {
        text: 'KAPAT',
        scale: 'medium',
        width: 100,
        cls: 'btn-article-close',
        listeners: {
            click: function() {
                winArticle.close();
            }
        }
    },
    '->',
    {
        text: 'EKLE',
        scale: 'medium',
        disabled: true,
        width: 100,
        margin: '0 9 0 0',
        cls: 'btn-article-save',
        id: 'btnArticleSave'
    }
]

});

4

2 回答 2

1

为什么选择这么复杂的方式?你为什么不只使用Window.add()Window.insert()方法?

使用Window.add()方法您可以在运行时添加组件。此方法将在最后添加您的组件/字段。如果要在特定位置插入,请使用Window.insert() => Actually this method is AbstractContainer's insert method. 有关更多信息,请参阅上面的链接。

于 2013-06-17T11:59:46.657 回答
0

是的,你可以计算你的 fieldset 中的字段。给 fieldset 一个 id 或 itemId 并获取它的对象。

winArticle.down('fieldset[id=yourfieldsetid]').items.items.length

此代码将为您提供字段集中的字段总数。

于 2013-06-17T12:00:19.017 回答