Ext 表单布局实例代码

ext.onready(function(){
ext.quicktips.init();
//第一句的目的是为需要的元件提供提示信息功能，form的主要提示信息就是客户端验证的错误信息了。
ext.form.field.prototype.msgtarget = 'under';
//第二句的目的就是设置控件的错误信息显示位置，主要可选的位置有：
var tdate = new ext.form.datefield({
fieldlabel: '日期',
emptytext: '请选择日期',
format: 'y-m-d',
disableddays: [0, 7]
});
var txt = new ext.form.textfield({
fieldlabel: '请输入姓名',
allowblank: false,
emptytext: '空',
maxlength: 50,
minlength: 10,
bodystyle: 'padding-left:5px',
anchor: '90%'//给错误提示留下10的空间,
});
var htmledt=new ext.form.htmleditor({
fieldlabel:'在线编辑器',
enablealignments:true,
enablecolors:true,
enablefont:true,
enablefontsize:true,
enableformat:true,
enablelinks:true,
enablelists:true,
enablesourceedit:true
});
var txt2 = new ext.form.textfield({
fieldlabel: '请输入姓名',
allowblank: false,
emptytext: '空',
maxlength: 50,
minlength: 10,
bodystyle: 'padding-left:5px',
anchor: '90%'
//给错误提示留下10的空间
});
var frm1 = new ext.form.formpanel({
labelalign: 'right',
labelwidth: 100,//注意修改标题的宽度
title: 'form1',
frame: true,
width: 700,
url: 'sender/data.aspx',
items: [{
layout: 'column',//正点的地方来了表示下一曾items都是按列"column"排序
items: [{
columnwidth: .5,
layout: 'form',//第一列里面内容就是form排序了,从上到下
items: [txt2]
},
{
columnwidth: .5,
layout: 'form',//第二列里面内容就是form排序了,从上到下
items: [txt, tdate]
}]
}, htmledt]
});
frm1.render("frm");
});