Form布局小实例

最新推荐文章于 2022-07-01 10:09:48 发布

rockethj8

最新推荐文章于 2022-07-01 10:09:48 发布

阅读量92

点赞数

分类专栏：技术类文章标签： EXT

本文链接：https://blog.csdn.net/rockethj8/article/details/83777435

版权

技术类专栏收录该内容

36 篇文章 0 订阅

订阅专栏

Form布局由类Ext.layout.FormLayout定义，名称为form，是一种专门用于管理表单中输入字段的布局，这种布局主要用于在程序中创建表单字段或表单元素等使用
<script type="text/javascript">
Ext.onReady(function(){
new Ext.Panel({
renderTo:"hello",
title:"面板组件",
width:400,
layout:"form",
hideLabels:false,
labelAlign:"right",
labelWidth:150,
height:200,
defaultType:'textfield',
items:[{fieldLabel:"please write name",name:"name"},{fieldLabel:"please write address",name:"add"},{fieldLabel:"please write telephone",name:"tel"}]
});
});

同上面的代码实现了一样的功能
Ext.onReady(function(){
new Ext.FormPanel({
renderTo:'hello',
title:'container tool',
width:300,
//layout:'form',
labelWidth:120,
hideLabels:false,
labelAlign:'right',
height:300,
defaultType:'textfield',
items:[{
fieldLabel:'name',
name:'name'
},{
fieldLabel:'age',
name:'age'
},{
fieldLabel:'sex',
name:'sex'
}]
});
});
</script>
</head>

<body>

<div id="hello"></div>
</body>
</html>