0

我有一个如下所示的 JS,我正在尝试构建一个带有多个选项卡的表单,并且在每个选项卡下我想添加一些标签、字段、无线电组等。我还处于起步阶段,但已经遇到问题;标签在所有情况下都可以正常显示,但在“联系电话”之后。标签,我看不到它正下方的物品,但可以看到地址标签。谁能告诉我我哪里弄错了!我想要“联系电话”。标签用作移动、主页、寻呼机和电子邮件文本字段的标题。

this.buildForm = function(){
        this.myForm = new Ext.form.FormPanel({
            layout:'column',
            border: false,
            labelWidth: labelWidth,
            anchor: "100%",
            items:[{
                columnWidth: 1,
                xtype:'tabpanel',
                activeTab: 0,
                height:420,
                enableTabScroll: true,
                deferredRender: false,
                bodyStyle:'padding:10px',
                items: [
                    {
                        title: 'Contact No. & Address',
                        i18nTitle: 'Person.contactNoAndAddress.title',
                        border: false,
                        items: [
                            {
                                xtype:'label',
                                text: 'Contact No.',
                                i18nTitle: 'Person.contactNo.title',
                                id: 'contactNo',
                                layout: 'column',
                                items: [
                                    {

                                        columnWidth: 0.33,
                                        layout: 'form',
                                        items:[
                                            {
                                                xtype:'textfield',
                                                fieldLabel: 'Mobile',
                                                tabIndex:101, 
                                                colwidth: 40
                                            }
                                        ]
                                    },{
                                        columnWidth: 0.33,
                                        layout: 'form',
                                        items:[
                                            {
                                                xtype:'textfield',
                                                fieldLabel: 'Home',
                                                tabIndex:102, 
                                                colwidth: 40
                                            }
                                        ]
                                    },{
                                        columnWidth: 0.33,
                                        layout: 'form',
                                        items:[
                                            {
                                                xtype:'textfield',
                                                fieldLabel: 'Office',
                                                tabIndex:103, 
                                                colwidth: 40
                                            }
                                        ]
                                    },{
                                        columnWidth: 0.33,
                                        layout: 'form',
                                        items:[
                                            {
                                                xtype:'textfield',
                                                fieldLabel: 'Pager',
                                                tabIndex:104, 
                                                colwidth: 40
                                            }
                                        ]
                                    },{
                                        columnWidth: 0.33,
                                        layout: 'form',
                                        items:[
                                            {
                                                xtype:'textfield',
                                                fieldLabel: 'Fax',
                                                tabIndex:105, 
                                                colwidth: 40
                                            }
                                        ]
                                    },{
                                        columnWidth: 1,
                                        layout: 'form',
                                        items:[
                                            {
                                                xtype:'textfield',
                                                fieldLabel: 'Email',
                                                width:200,
                                                tabIndex:106, 
                                                width: 200
                                            }
                                        ]
                                    }
                                ]
                            },{
                                xtype:'tabpanel',
                                id: 'addressTab',
                                permission:'person:responsibleAdmin',
                                activeTab: 0,
                                height:220,
                                enableTabScroll: false,
                                deferredRender: false,
                                bodyStyle:'padding:10px',
                                layoutOnTabChange: true,
                                items: [
                                    {
                                        title: 'Home Address',
                                        i18nTitle: 'Person.homeAddress.title',
                                        border: false,
                                        // hideMode: "offsets",
                                        items:[{}]
                                    },{
                                        title: 'Work Address',
                                        i18nTitle: 'Patient.workAddress.title',
                                        border: false,
                                        // hideMode: "offsets",
                                        items:[{}]
                                    }
                                ]
                            }
                        ]
                    },{
                        title:'Next of Kin',
                        i18nTitle: 'Person.nextOfKin.title',
                        layout: 'column',
                        labelWidth: 100,
                        items:[{

                        }]
                    }
                ]
            }]
        });
        return this.myForm;
    }
4

1 回答 1

0

如果我理解正确,对于您想要获得的内容,您需要文本字段Mobile与标签处于同一级别Contact No而不是他的孩子。

看看我如何修改 jsfiddle:http: //jsfiddle.net/zWdXf/6/

以下是您需要的那部分代码的详细信息:

            items: [{
                xtype: 'label',
                text: 'Contact No.2',
                i18nTitle: 'Person.contactNo.title',
                id: 'contactNo',
                layout: 'column',
                items: [{}]
            },{
                xtype: 'textfield',
                fieldLabel: 'Mobile',
                i18nTitle: 'Person.contactNo.title',
                id: 'contactNo2',
                layout: 'column',
                items: [{}]
            }, {
                xtype: 'tabpanel',
                id: 'addressTab',
                permission: 'person:responsibleAdmin',
                activeTab: 0, [...]
于 2013-08-13T13:41:08.200 回答