(20)ExtJS之Ext.form.FieldContainer容器字段

最新推荐文章于 2022-05-13 06:30:12 发布

无人与我共黄昏

最新推荐文章于 2022-05-13 06:30:12 发布

阅读量7.1k

点赞数

分类专栏： ExtJS案例

本文链接：https://blog.csdn.net/xuan6251237011/article/details/20084297

版权

ExtJS案例同时被 2 个专栏收录

47 篇文章 0 订阅 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

EXTJS代码

47 篇文章 0 订阅

订阅专栏

本文详细探讨了ExtJS中Ext.form.FieldContainer组件的使用，它允许开发者将多个字段组合成一个容器，以实现更复杂的表单布局和交互。通过实例代码，展示了如何创建和配置FieldContainer，以及如何在实际项目中应用。

摘要由CSDN通过智能技术生成

JS文件：

//4:Ext.form.FieldContainer示例,需要将多个字段或者组件作为一个表单项展现的时候
Ext.onReady(function(){
	Ext.QuickTips.init();//初始化提示
	Ext.create('Ext.form.FormPanel',{
		title:'Ext.form.FieldContainer示例',
		width:300,
		frame:true,
		renderTo:Ext.getBody(),
		bodyPadding:5,
		fieldDefaults:{//统一设置表单字段的默认属性
			labelSeparator:':',//分隔符
			labelWidth:60,//标签宽度
			width:260,//字段宽度
			msgTarget:'side'
		},
		defaultType:'textfield',//设置表单的默认类型
		items:[{
			fieldLabel:'商品名称'
		},{
			xtype:'fieldcontainer',
			fieldLabel:'生产日期',
			layout:{//设置容器字段布局
				type:'hbox',
				align:'middle'//垂直居中
			},
			combineErrors:true,//合并展示错误信息
			fieldDefaults:{
				hideLabel:true,//隐藏字