|
|
 <HTML>
<HEAD>
<TITLE> New Document </TITLE>
<link rel="stylesheet" type="text/css" href="../../../resources/css/ext-all.css"/>
<script type="text/javascript" src="../../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../../ext-all.js"></script>
  <SCRIPT LANGUAGE="JavaScript">
 <!--
  /**//*
* msgTarget的幾種配置
* qtip 當光標停留在域上時顯示一個快速提示
title 顯示一個默認的瀏覽標題屬性彈出
under 增加一個空div在域下面并顯示錯誤信息
side 增加一個錯誤圖標在域右邊,鼠標懸停時顯示錯誤信息
 */
Ext.onReady(function()
{
//初始化快速提示
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'qtip';
var bd = Ext.getBody();
bd.createChild({
tag : 'h3',
html: 'Form中的復雜編輯器'
});
var form = new Ext.FormPanel({
labelAlign : 'top',
title : 'Inner Tabs',
bodyStyle : 'padding : 5px',
width : 600,
frame : true,
onSubmit: Ext.emptyFn,
submit: function() {
this.getForm().getEl().dom.submit();
},
items : [
{
layout : 'column',
border : false,
items :
[
{
columnWidth : .5,
layout : 'form',
border : false,
items:[{
xtype : 'textfield',
allowBlank : false,
blankText : '名字不能為空',
fieldLabel : '名',
name : 'first',
anchor : '95%' //上級容器寬度的百分比,即此控件的寬度
},
{
xtype : 'textfield',
minLength : 3,
maxLength : 5,
minLengthText : '公司長度不能小于3',
maxLengthText : '公司長度不能大于5',
fieldLabel : '公司',
name : 'company',
anchor : '95%'
}]
}
]
},
{
columnWidth : .5,
layout : 'form',
border : false,
items : [
{
xtype : 'textfield',
fieldLabel : '地址',
maxLength : 50,
maxLengthText : '地址長度不能超過50個字符',
name : 'address',
anchor : '95%'
},
{
xtype : 'textfield',
fieldLabel : '郵箱',
name : 'email',
vtype : 'email',
vtypeText : '郵箱格式不正確',
anchor : '95%'
}
]
},
{
xtype : 'tabpanel',
plain : true, //不用背景圖片
activeTab : 0,
height : 235,
defaults : {bodyStyle : 'padding : 10 px'},
items:[
{
title : '個人信息',
layout : 'form',
defaults : {width : 230},
defaultType : 'textfield',
items : [
{
fieldLabel : '名字',
name : 'first',
allowBlank : false,
value : '天使'
},
{
fieldLabel : '編輯器',
name : 'editor',
xtype : 'htmleditor'
}
]
},
{
title : '電話號碼',
layout : 'form',
defaults:{width : 230},
defaultType : 'textfield',
items :[
{
fieldLabel : '宅電',
name : 'home',
value : '(888) 555-1212'
},
{
fieldLabel : '公司電話',
name : 'mobile'
},
{
fieldLabel : '傳真',
name : 'fax'
}
]
},
{
cls : 'x-plain',
title : 'Html編輯器',
layout : 'fit',
items : {
xtype : 'htmleditor', //html復雜編輯器
id : 'bio2',
fieldLabel : 'Biogarphy'
}
},
{
title : '彈出式編輯器',
layout : 'form',
items: [
{
xtype : 'button',
text : '彈出式html編輯器',
handler : function()
{
new Ext.form.HtmlEditor(
{
renderTo: 'editor', //Ext.getBody(),
width: 300,
draggable : true,
height: 300,
x : 200,
y :200,
frame: true,
layout: 'fit'
});
}
}
]
}
]
}
],
buttons : [
{
text : '保存',
handler : function()
{
if(form.getForm().isValid())
{
form.getForm().getEl().dom.action = 'http://www.tkk7.com/supercrsky';
form.getForm().getEl().dom.submit();
}
}
},
{
text : '重置',
handler : function()
{
form.getForm().getEl().dom.reset();
}
}
]
});
form.render(document.body);
});
//-->
 </SCRIPT>
</HEAD>
<BODY>
<div id='editor'></div>
</BODY>
</HTML>
|