|
|
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");
});
JavaScript技術：Ext 表單布局實例代碼，轉載需保留來源！
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。
