手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Ext 表单布局实例代码
Ext 表单布局实例代码
摘要:复制代码代码如下:Ext.onReady(function(){Ext.QuickTips.init();//第一句的目的是为需要的元件提供...

复制代码 代码如下:

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

});

【Ext 表单布局实例代码】相关文章:

一段实时更新的时间代码

JQuery球队选择实例

JQuery中Text方法用法实例分析

将HTML自动转为JS代码

Javascript中For In语句用法实例

网页里控制图片大小的相关代码

表单的一些基本用法与技巧

jQuery聚合函数实例

表单提交验证类

JQuery中层次选择器用法实例详解

精品推荐
分类导航