`
Althars
  • 浏览: 76141 次
  • 性别: Icon_minigender_1
  • 来自: 成都
文章分类
社区版块
存档分类

EXT 多个radio 横向排列

EXT 
阅读更多

项目中用到radio,横向排了2个一切正常,排了4个就完全混乱,baidu了一下,用 layout:'column',  layout: 'form', 混合用来解决

//各个输入项
    var panelItem=  [

    		       {
                    		columnWidth:1,
                			layout: 'form',
                			items:[{
	                    		xtype:'hidden',
			                    fieldLabel: '编号',
			                    id:'id',
			                    name: 'Obj.id',
			                    readOnly:true,
			                    hidden:false,
			                    width: 100,
			                    maxLength:10,
			                    minLength:1,
			                    allowBlank: false
                    			}]

	                    },
	              {
                    		columnWidth:1,
                			layout: 'form',
                			items:[{
                			    xtype:'hidden',
			                    fieldLabel: '父节点id',
			                    id:'pId',
			                    msgTarget:'under',
			                    name: 'Obj.base.id',//避免冲突
			                    height:22,
width:180,
			                    readOnly:true,
			                    maxLength:20,
			                    allowBlank: true }
                    			]

	                    },
    		    {
                    layout:'column',
                    items:[
                    	{
                    		columnWidth:.5,
                			layout: 'form',
                			items:[{
	                    		xtype:'textfield',
                                fieldLabel: '父节点',
			                    id:'parentName',
			                    hidden:false,
			                    readOnly:true,
			                    name: 'parentName', //此项只为显示
			                    height:22,
                                width:180,
			                    minLength:1
                    			}]

	                    },
	                    {
	                    	columnWidth:.5,
                			layout: 'form',
                			items:[{xtype:'textfield',
			                    fieldLabel: '名   称',
			                    id:'name',
			                    msgTarget:'under',
			                    name: 'Obj.name',
			                    height:22,
                                width:180,
			                    maxLength:20,
			                    allowBlank: false }]
	                    },



	                    	                     {
 	columnWidth:.5,
                 layout:'column',
                 items:[
                       {
                       	columnWidth:.5,
                         layout: 'form',
                         items: [new Ext.form.Radio({style:'margin-top:5px',
                         fieldLabel: '长   度',
                         id:'length1',
			                    			boxLabel:'有',
							                name: 'Obj.length',
							                inputValue:1,
							                checked:false})]
                     },

                     {
                     	columnWidth:.5,

                     	items: [new Ext.form.Radio({style:'margin-top:5px',
                     id:'length2',
			                    			boxLabel:'无',
							                name: 'Obj.length',
							                inputValue:0,
							                checked:true})]
                     }
                     ]
             },



	                     {
 	columnWidth:.5,
                 layout:'column',
                 items:[
                       {
                       	columnWidth:.5,
                         layout: 'form',
                         items: [new Ext.form.Radio({style:'margin-top:5px',
                         fieldLabel: '宽   度',
                         id:'width1',
			                    			boxLabel:'有',
							                name: 'Obj.width',
							                inputValue:1,
							                checked:false})]
                     },

                     {columnWidth:.5,
                     items: [new Ext.form.Radio({style:'margin-top:5px',
                     id:'width2',
			                    			boxLabel:'无',
							                name: 'Obj.width',
							                inputValue:0,
							                checked:true})]
                     }
                     ]
             },



 {
 	columnWidth:.5,
                 layout:'column',
                 items:[
                       {
                       	columnWidth:.5,
                         layout: 'form',
                         items: [new Ext.form.Radio({style:'margin-top:5px',
                         fieldLabel: '高   度',
                         id:'height1',
			                    			boxLabel:'有',
							                name: 'Obj.height',
							                inputValue:1,
							                checked:false})]
                     },

                     {
                     	columnWidth:.5,
                     	items: [new Ext.form.Radio({style:'margin-top:5px',
                     id:'height2',
			                    			boxLabel:'无',
							                name: 'Obj.height',
							                inputValue:0,
							                checked:true})]
                     }
                     ]
             },

 {
 	columnWidth:.5,
                 layout:'column',
                 items:[
                       {
                       	columnWidth:.5,
                         layout: 'form',
                         items: [new Ext.form.Radio({style:'margin-top:5px',
                         fieldLabel: '体   积',
                         id:'volume1',
			                    			boxLabel:'有',
							                name: 'Obj.volume',
							                inputValue:1,
							                checked:false})]
                     },

                     {
                     	columnWidth:.5,
                     items: [new Ext.form.Radio({style:'margin-top:5px',
                     id:'volume2',
			                    			boxLabel:'无',
							                name: 'Obj.volume',
							                inputValue:0,
							                checked:true})]
                     }
                     ]
             },



	                     {
	                    	columnWidth:.5,
                			layout: 'form',
                			items:[{xtype:'textfield',
			                    fieldLabel: '备   注',
			                    id:'descn',
			                    msgTarget:'under',
			                    name: 'Obj.descn',
			                    height:22,
                                width:180,
			                    maxLength:20,
			                    allowBlank: true }]
	                    }
	                   ]
                }


                ];

	//form
    var panel = new Ext.FormPanel({
        applyTo: 'Content-render-panel-div',
        frame:true,
        url:'saveOrUpdateBase.action',
        //reader:thospital,
        autoHeight:true,
        autoWidth:true,
        autoScroll:true,
        items:panelItem ,
		buttons: [{
            text: '保存',
            id:'hsubmit',
            handler:save
        }]
 
  • 大小: 9.3 KB
分享到:
评论

相关推荐

    ext3横向菜单

    8. **软硬链接**:EXT3支持创建文件的多个名称(软链接)和指向同一数据的不同inode(硬链接),提供了灵活的文件组织方式。 对于“EXT3横向菜单”的具体功能,可能包括浏览EXT3分区、查看文件和目录属性、挂载和...

    在Ext的grid里实现带radio单选功能的gridlist

    在Ext JS这个强大的JavaScript框架中,开发人员经常需要创建数据展示组件,比如Grid,来显示大量数据并提供交互性。Grid List是Grid的一种扩展,它不仅具有基本的表格功能,还可以进行更复杂的操作。本教程将详细...

    Ext3.X横向菜单导航栏

    在Ext3.X中,横向菜单导航栏是一种常见的用户界面元素,它提供了清晰的层级结构,帮助用户在复杂的Web应用中快速定位和访问功能。本知识点将深入探讨如何在Ext3.X中实现横向菜单导航栏,并基于给定的描述和资源进行...

    ext tab多行显示

    ext 多个tab页多行显示 ext 多个tab页多行显示 ext 多个tab页多行显示

    Ext3.0实现多文件上传.rar

    在“Ext3.0实现多文件上传.rar”这个压缩包中,我们聚焦于一个特定的功能:使用Ext3.0来实现实时的多文件上传功能。这个功能通常在网页应用中用于让用户能够一次性上传多个文件,如图片、文档等,极大地提高了用户...

    ext-------竖向标签TabPanel

    竖向标签TabPanel-------------------------------------------------

    Ext教程ext2-Ext简易教程

    Ext是一个强大的JavaScript库,专为构建富客户端的Web应用程序而设计。它是一个Ajax框架,意味着它专注于通过异步通信更新用户界面,以提供更流畅、响应更快的用户体验。Ext的核心特性在于其丰富的用户界面组件和...

    ext4.0 多文件上传

    下面,我们将结合ext4.0文件系统的特性以及多文件上传技术的实现,全面深入地探讨这个主题。 ext4.0文件系统在Linux内核中占据了举足轻重的地位,其作为ext3的升级版,主要通过引入多项创新技术来优化文件存储性能...

    ext3.jar ext使用非常多

    EXT3.jar是EXT框架的一个版本,它包含EXT库的Java版本,通常用于Java Web应用程序,使得开发者能够利用EXT的组件和功能在服务器端进行渲染和处理。 EXT框架的核心在于其丰富的组件库,包括数据网格、表单、窗口、...

    Ext 3.4 多表头 列锁定

    这个问题可能与CSS样式、布局或者组件的排列顺序有关,修复可能需要调整相关代码或更新Ext JS库的特定部分。 在提供的文件列表中,"LockingGridView+BufferView+GroupHeaderPlugin"暗示了用于实现这一功能的几个...

    Ext+Struts2多文件上传

    在本文中,我们将深入探讨如何使用ExtJS(Ext)与Struts2.0框架整合,实现多文件上传功能。这是一个常见的需求,在Web应用中,用户可能需要上传多个文件,如图片、文档等。通过理解这一过程,开发者可以构建更强大、...

    ext 多表头和锁定列结合的示例

    在EXT JS这个强大的JavaScript库中,多表头和锁定列的结合使用是创建复杂、功能丰富的数据展示表格的重要手段。EXT JS允许开发者构建高度自定义的用户界面,尤其是在处理大量数据时,锁定列和多表头功能能显著提高...

    ext教程、ext核心API 、ext中文教程

    在压缩包中的"EXT教程"文件,可能包含了从入门到进阶的各类教程文章,覆盖了EXT的基本概念、组件使用、布局配置、数据绑定等多个方面。通过阅读这些教程,你可以逐步掌握EXT的开发技巧,从而构建出专业级别的Web应用...

    Ext多文件上传

    "Ext多文件上传"通常指的是使用ExtJS库实现的批量或同时上传多个文件的功能。 在实现多文件上传时,我们需要考虑以下几个核心知识点: 1. **表单提交**:在HTML中,表单通常用于收集用户数据并将其发送到服务器。...

    EXT帮助文档(中文EXT3.0 API,中文EXT2.2 API)

    EXT库的使用涵盖了前端开发的多个方面,包括但不限于: 1. **组件系统**:EXT的核心是它的组件模型,允许开发者通过组合各种预定义的组件来构建复杂的用户界面。 2. **数据绑定**:EXT提供了强大的数据绑定机制,...

    Windows读取Ext4分区的工具 Ext2Read

    总结来说,Ext2Read是一个实用的工具,帮助Windows用户方便地访问和提取Linux EXT分区的数据,扩展了跨平台操作的可能性。不过,在使用过程中,用户应当遵循相应的安全规范,避免对数据造成不必要的损害。

    EXT2.3+EXT2.0教程

    EXT2.0是一个重要的里程碑,它引入了许多新特性,例如改进了布局系统,使得组件的排列和自适应更加灵活。同时,EXT2.0增强了表格控件,提供了分页、排序和过滤等功能,极大地提升了数据展示的效率。此外,2.0版本还...

    EXT3.2 多选下拉框

    EXT3.2 多选下拉框是一种在EXT JS框架中实现的用户界面组件,它允许用户在下拉菜单中选择多个选项。EXT JS是一个基于JavaScript的富客户端应用开发框架,用于构建桌面级的Web应用。EXT3.2是EXT JS的一个版本,尽管...

    java-ext.zip_ext_ext java_ext 标签_ext java_java ext

    Java是一种多平台的、面向对象的编程语言,而ExtJS则是一个用于构建富客户端Web应用的JavaScript框架。它们之间的结合能够帮助开发者创建功能丰富的、交互性极强的Web应用程序。在这个名为"java-ext.zip_ext_ext ...

    在windows下使用Ext2Fsd访问EXT4分区

    Ext2Fsd是一个免费的开源软件,专门设计用于Windows系统上读/写Linux的EXT2、EXT3和EXT4文件系统。 **Ext2Fsd的主要功能:** 1. **读写支持**:Ext2Fsd允许Windows用户直接访问EXT4分区,包括读取文件、创建文件、...

Global site tag (gtag.js) - Google Analytics