FormPanel组件
FormPanel 为 form 表单提供了一个标准的容器. 本质上还是一个标准的 Ext.panel.Panel, 只是自动创建了一个 BasicForm 来管理所有添加到 Panel中的Ext.form.field.Field 对象. 可以快捷方便地进行 配置以及处理 BasicForm 和 表单域.
1、示例：
在window窗体中添加一个FormPanel组件
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <link rel="stylesheet" type="text/css" href="../ext-js-4.2.1/resources/css/ext-all.css" /> <script type="text/javascript" src="../ext-js-4.2.1/ext-all.js"></script> <script type="text/javascript" src="../ext-js-4.2.1/locale/ext-lang-zh_CN.js"></script> <script type="text/javascript"> Ext.onReady(function() { var form = new Ext.form.FormPanel({ frame : true, title : '表单标题', style : 'margin:10px', // draggable : true, //可拖拽 html : '<div style ="padding:10px">这里是表单内容</div>' }); var win = new Ext.Window({ title : '窗体window', width : 500, height : 200, draggable : true, html : '<div>这里是窗体的内容</div>', resizable : true, modal : true, closable : true, maximizable : true, minimizable : true, items : form }); win.show(); }); </script> </head> <body> <!-- 说明： (1)var form = new Ext.form.FormPanel({}):创建一个新的form表单对象。 (2)title: '表单标题'：表单的标题，如果不加的话，不会出现上面的浅色表单标题栏。 (3)style: 'margin:10px':表单的样式，加了个外10px的外边距。 (4)html: '<div style="padding:10px">这里表单内容</div>'：表单内显示html的内容。 (5)frame:true：true 为 Panel 填充画面,默认为false. --> </body> </html>
2：效果图：
3：常用属性及方法：
（1）属性：
整型，表单宽度。
height:整型，表单高度。
url:字符串，表单提交地址。
frame:true 为 Panel 填充画面,默认为false。
（2）方法：
reset:表单重置。
isValid:表单是否验证全部通过。
submit:表单提交