Extjs 实现布局 Demo

java-mans

浏览: 11438617 次

最近访客更多访客>>

morelily

devcang

serisboy

chjinniu

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (15568)

社区版块

存档分类

2012-08 ( 1467)
2012-07 ( 1872)
2012-06 ( 1125)
更多存档...

<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>

分享到：