<%@ page contentType="text/html;charset=UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>onReady</title>
<link rel="stylesheet" type="text/css"
href="/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/ext/ext-all.js"></script>
<script type="text/javascript">
function myPanel()
{
itemsA = [
{
fieldLabel:"UserName",//文本框標題
name:"user",
id:"user",
},
{
fieldLabel:"PassWord",
inputType:"password",
name:"pass",
id:"pass",
}
];
itemsB = [
{
xtype:'fieldset',
title: '個人信息',
collapsible: true,
autoHeight:true,
width:330,
defaults: {width: 150},
defaultType: 'textfield',
items :[{
fieldLabel: '愛好',
name: 'hobby',
value: 'www.cnblogs.com'
},{
xtype:"combo",
name: 'sex',
store:["男","女","保密"],//數據源為一數組
fieldLabel:"性別",
emptyText:'請選擇性別.'
}]
}
];
var form1 = new Ext.form.FormPanel(
{
width:350,
frame:true,//圓角和淺藍色背景
renderTo:"form1",//呈現
title:"FormPanel",
bodyStyle:"padding:5px 5px 0",
defaults:{width:200,xtype:"textfield"},
items:itemsB,
buttons:[{text:"確定"},{text:"取消",handler:function(){alert("事件！");}}]
});
}
Ext.onReady(myPanel);
</script>
</head>
<body>
<div id="form1"></div>
</body>
</html>