无废话ExtJs 入门教程四[表单:FormPanel]


朋友炒股两个月赚了10万,我帮他推广一下公众号,把钱用来投资总比放银行连通货膨胀都跑不过里强硬核离职,在家炒股 ,这是他每天的日志,有些经验是花钱也买不到的。

继上一节内容,我们在窗体里加了个表单。如下所示代码区的第28行位置,items:form。

1.代码如下:

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <title></title>
 5     <!--ExtJs框架开始-->
 6     <script type="text/javascript" src="/Ext/adapter/ext/ext-base.js"></script>
 7     <script type="text/javascript" src="/Ext/ext-all.js"></script>
 8     <link rel="stylesheet" type="text/css" href="/Ext/resources/css/ext-all.css" />
 9     <!--ExtJs框架结束-->
10     <script type="text/javascript">
11         Ext.onReady(function () {
12             var form = new Ext.form.FormPanel({
13                 frame: true,
14                 title: '表单标题',
15                 style: 'margin:10px',
16                 html: '<div style="padding:10px">这里表单内容</div>'
17             });
18             var win = new Ext.Window({
19                 title: '窗口',
20                 width: 476,
21                 height: 374,
22                 html: '<div>这里是窗体内容</div>',
23                 resizable: true,
24                 modal: true,
25                 closable: true,
26                 maximizable: true,
27                 minimizable: true,
28                 items: form
29             });
30             win.show();
31         });
32     </script>
33 </head>
34 <body>
35     <!--
36 说明:
37 (1)var form = new Ext.form.FormPanel({}):创建一个新的form表单对象。
38 (2)title: '表单标题':表单的标题,如果不加的话,不会出现上面的浅色表单标题栏。
39 (3)style: 'margin:10px':表单的样式,加了个外10px的外边距。
40 (4)html: '<div style="padding:10px">这里表单内容</div>':表单内显示html的内容。
41 -->
42 </body>
43 </html>

2.效果如下:

3.form 组件常用的:属性、方法及事件

一、属性

width:整型,表单宽度。

height:整型,表单高度。

url:字符串,表单提交地址。

二、方法

reset:表单重置。

isValid:表单是否验证全部通过。

submit:表单提交。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM