Question

我有一个看起来像下面的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;
    }

Answer 1

如果我理解正确，您需要将文字字段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, [...]

javascript表单无法显示

1 个答案: