EXT JS模板由几部分组成

| 如何创建具有较小零件的表单面板。较小的部分应可在模板中重复使用。     
已邀请:
我为此使用助手。这是一个应该向您展示技巧的示例。
/// limitForm : array with all ellemts that should be taken from the inner form. can be null or empty to take all
FormContent.loginForm = function (limitForm) {
    var defaults = [
    {/* this has the ID 0 */
        xtype: \'Fieldset\',
        title: \'Username\',
        layout: \'form\',
        items: [
            {
                xtype: \'panel\',
                layout: \'form\',
                header: false,
                hideBorders: true,
                bodyBorder: false,
                border: false,
                height: 40,
                items: [
                    {
                        xtype: \'textfield\',
                        fieldLabel: \'Username\',
                        regex: /^[\\w\\s\\.]*$/,
                        regexText: \'No special chars allowed in this field\',
                        anchor: \'100%\',
                        name: \'LoginName\'
                    }
                ]
            }
        ]
    }
    ,
    {/* this has the ID 1 */
        xtype: \'Fieldset\',
        title: \'Additional data\',
        layout: \'form\',
        items: [
        {   
            xtype: \'panel\',
            layout: \'column\',
            header: false,
            border: false,
            bodyBorder: false,
            height: 40,
            items: [
                {
                    xtype: \'panel\',
                    layout: \'form\',
                    header: false,
                    columnWidth: 0.5,
                    hideBorders: true,
                    bodyBorder: false,
                    border: false,
                    items: [
                        {
                            xtype: \'textfield\',
                            fieldLabel: \'Title\',
                            anchor: \'100%\',                                             
                            name: \'Title\'
                        }
                    ]
                },
                {
                    xtype: \'panel\',
                    layout: \'form\',
                    header: false,
                    columnWidth: 0.5,
                    style: \'margin-left: 18px\',
                    hideBorders: false,
                    border: false,
                    bodyBorder: false,
                    labelWidth: 65,
                    items: [
                        {
                            xtype: \'textfield\',
                            fieldLabel: \'Title\',
                            anchor: \'100%\',                                             
                            name: \'Title\'
                        }
                    ]
                }
            ]
        }
    }
    ];

    if (limitForm) {
        var ds = [];
        for (var i = 0, len = limitForm.length; i < len; i++) {
            ds.push(defaults[limitForm[i]]);
        }
        defaults = ds;
    }

    return defaults;
}
如果要重用它,则可以使用配置数组或字段名称修改函数参数(名称必须更改,否则将只提交一个字段)。但是我认为它应该向您显示窍门。 可以肯定的是,这是在主窗体中加载的!     

要回复问题请先登录注册