ext.js php 实例,Ext 表单布局实例代码_extjs

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");

});

本文原创发布php中文网，转载请注明出处，感谢您的尊重！