<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ExtJS</title>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript" src="Extjs/source/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" language="javascript">
/*
作者 孙聪聪
*/
Ext.onReady(function() {
var L_RowOne=new Ext.Panel({
frame:true,
height:200,
width:600,
title:"面板头部header",
renderTo:divPanel,
layout:"column",
border:false,
buttons:[{text:"按钮位于footer"}],
items:[{
layout:'form',
columnWidth:.5,
border:false,
items:[
{xtype: "textfield", id: "userName", fieldLabel: "用户名" ,style:"margin:1 3 15 3", labelWidth: 5, emptyText: "请输入用户名", allowBlank: false, blankText: "用户名不能为空" },
{xtype: "textfield", id: "userPass", fieldLabel: "密 码", style: "margin:1 3 15 3", labelWidth: 5, inputType: "password" },
{xtype: "textfield", id: "confirm", fieldLabel: "确认密码", style: "margin:1 3 15 3", labelWidth: 5, inputType: "password" }
]
},
{
layout:'form',
columnWidth:.5,
border:false,
defaultType: 'textfield',
items:[
{xtype: "textfield", id: "userName1", fieldLabel: "用户名" ,style:"margin:1 3 15 3", labelWidth: 5, emptyText: "请输入用户名", allowBlank: false, blankText: "用户名不能为空" },
{xtype: "textfield", id: "userPass1", fieldLabel: "密 码", style: "margin:1 3 15 3", labelWidth: 5, inputType: "password" },
{xtype: "textfield", id: "confirm1", fieldLabel: "确认密码", style: "margin:1 3 15 3", labelWidth: 5, inputType: "password" }
]
}]
});
});
</script>
</head>
<body>
<div id="divPanel">
</div>
</body>
</html>Extjs 实现布局 Demo
最新推荐文章于 2023-07-22 10:05:00 发布
530
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
