码迷,mamicode.com
首页 > 其他好文 > 详细

FORM 布局

时间:2020-06-20 14:02:28      阅读:47      评论:0      收藏:0      [点我收藏+]

标签:hid   must   png   lse   one   als   default   contact   first   

技术图片

            xtype: ‘form‘,
            layout: ‘column‘,
            defaults: {
                style: ‘float:left;margin:4px;‘,
                columnWidth: 0.49,
                msgTarget: ‘side‘
            },
            defaultType: ‘textfield‘,
            fieldDefaults: {
                labelAlign: ‘right‘,
                labelWidth: 84
            },
            items: [
                {
                    allowBlank: false,
                    fieldLabel: ‘上级编码‘,
                    name: ‘parentOrganizationCode‘
                }, {
                    fieldLabel: ‘状态‘,
                    name: ‘enable‘
                }, {
                    allowBlank: false,
                    fieldLabel: ‘组织架构编码‘,
                    name: ‘organizationCode‘
                }, {
                    allowBlank: false,
                    fieldLabel: ‘组织架构名称‘,
                    name: ‘organizationName‘
                }, {
                    fieldLabel: ‘地址‘,
                    name: ‘contactAddress‘,
                    columnWidth: 0.98
                }, {
                    fieldLabel: ‘备注‘,
                    name: ‘note‘,
                    columnWidth: 0.98
                }
            ]

 技术图片

xtype: ‘form‘,
            items: [{
                xtype: ‘fieldset‘,
                title: ‘Your Contact Information‘,
                defaultType: ‘textfield‘,
                layout: ‘anchor‘,
                defaults: {
                    anchor: ‘100%‘
                },
                items: [{
                    xtype: ‘fieldcontainer‘,
                    fieldLabel: ‘Name‘,
                    layout: ‘hbox‘,
                    combineErrors: true,
                    defaultType: ‘textfield‘,
                    defaults: {
                        hideLabel: ‘true‘
                    },
                    items: [{
                        name: ‘firstName‘,
                        fieldLabel: ‘First Name‘,
                        flex: 2,
                        emptyText: ‘First‘,
                        allowBlank: false
                    }, {
                        name: ‘lastName‘,
                        fieldLabel: ‘Last Name‘,
                        flex: 3,
                        margin: ‘0 0 0 6‘,
                        emptyText: ‘Last‘,
                        allowBlank: false
                    }]
                }, {
                    xtype: ‘container‘,
                    layout: ‘hbox‘,
                    defaultType: ‘textfield‘,
                    margin: ‘0 0 5 0‘,
                    items: [{
                        fieldLabel: ‘Email Address‘,
                        name: ‘email‘,
                        vtype: ‘email‘,
                        flex: 1,
                        allowBlank: false
                    }, {
                        fieldLabel: ‘Phone Number‘,
                        labelWidth: 100,
                        name: ‘phone‘,
                        width: 200,
                        emptyText: ‘xxx-xxx-xxxx‘,
                        maskRe: /[\d\-]/,
                        regex: /^\d{3}-\d{3}-\d{4}$/,
                        regexText: ‘Must be in the format xxx-xxx-xxxx‘
                    }]
                }]
            }]

技术图片

 

 

xtype: ‘form‘,
            layout: ‘column‘,

            defaults: {
                layout: ‘form‘,
                xtype: ‘container‘,
                defaultType: ‘textfield‘,
                style: ‘width: 50%‘
            },

            items: [{
                items: [
                    { fieldLabel: ‘First Name‘ },
                    { fieldLabel: ‘Last Name‘ },
                    { fieldLabel: ‘Phone Number‘ },
                    { fieldLabel: ‘Email Address‘ }
                ]
            }, {
                items: [
                    { fieldLabel: ‘Street Address 1‘ },
                    { fieldLabel: ‘Street Address 2‘ },
                    { fieldLabel: ‘City, State‘ },
                    { fieldLabel: ‘ZIP code‘ }
                ]
            }]

 https://www.cnblogs.com/MaiJiangDou/p/7693691.html

FORM 布局

标签:hid   must   png   lse   one   als   default   contact   first   

原文地址:https://www.cnblogs.com/xsSystem/p/13168205.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!