Ext的横向表单实现

最新推荐文章于 2019-04-23 16:53:00 发布

CoderQ

最新推荐文章于 2019-04-23 16:53:00 发布

阅读量540

点赞数

分类专栏： ExtJs 文章标签： ext border layout function action url

本文链接：https://blog.csdn.net/CoderQ/article/details/7232075

版权

ExtJs 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

Ext.create('Ext.form.Panel', {
		layout: 'anchor',
		border: false,
		url: 'action/editor.action.php',
		defaults: {
			labelAlign: 'right',
			labelWidth: 80,
			margin: '15 0 15 0',
			anchor: '99%'
		},
		items: [{
			xtype: 'textfield',
			fieldLabel: '文章标题',
			name: 'sTitle',
			allowBlank: false
		},{
			layout: 'column',
			border: false,
			items: [{
				columnWidth: .75,
				layout: 'anchor',
				border: false,
				defaults: {
					labelAlign: 'right',
					labelWidth: 80,
					margin: '15 0 15 0',
					anchor: '99%'
				},
				items: [{
					xtype: 'textfield',
					fieldLabel: '文章标签',
					name: 'sTag',
					allowBlank: false
				}]
			},{
				columnWidth: .25,
				layout: 'anchor',
				border: false,
				defaults: {
					labelAlign: 'right',
					labelWidth: 80,
					margin: '15 0 15 0',
					anchor: '99%'
				},
				items: [{
					xtype: 'combobox',
					fieldLabel: '文章分类',
					name: 'iType',
					allowBlank: false,
					editable: false
				}]
			}]
		},{
			xtype: 'htmleditor',
			fieldLabel: '文章内容',
			name: 'sContent',
			allowBlank: false,
			height: 300
		},{
			xtype: 'hidden',
			name: 'sAction',
			value: 'AddNote'
		}],
		buttons: [{
			text: '提交',
			formBind: true, //only enabled once the form is valid
			disabled: true,
			handler: function() {
				var form = this.up('form').getForm();
				if (form.isValid()) {
					form.submit({
						success: function(form, action) {
						   Ext.Msg.alert('Success', action.result.msg);
						},
						failure: function(form, action) {
							Ext.Msg.alert('Failed', action.result.msg);
						}
					});
				}
			}
		}],
    	renderTo: Ext.getBody()
	});

记下来，免得以后又忘了