extjs技术交流，欢迎加群（201926085)

继上一节内容，我们在窗体里加了个表单。如下所示代码区的第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:表单提交。

活到老,学到老,练到老...

无废话ExtJs 入门教程四[表单：FormPanel]的更多相关文章

  1. 无废话ExtJs 入门教程十五[员工信息表Demo：AddUser]

    无废话ExtJs 入门教程十五[员工信息表Demo:AddUser] extjs技术交流,欢迎加群(201926085) 前面我们共介绍过10种表单组件,这些组件是我们在开发过程中最经常用到的,所以一 ...

  2. 无废话ExtJs 入门教程十四[文本编辑器：Editor]

    无废话ExtJs 入门教程十四[文本编辑器:Editor] extjs技术交流,欢迎加群(201926085) ExtJs自带的编辑器没有图片上传的功能,大部分时候能够满足我们的需要. 但有时候这个功 ...

  3. 无废话ExtJs 入门教程十七[列表：GridPanel]

    无废话ExtJs 入门教程十七[列表:GridPanel] extjs技术交流,欢迎加群(201926085) 在Extjs中,GridPanel用于数据显示,即我们平时说的列表页.在本节中,我们先对 ...

  4. 无废话ExtJs 入门教程十六[页面布局：Layout]

    无废话ExtJs 入门教程十六[页面布局:Layout] extjs技术交流,欢迎加群(201926085) 首先解释什么是布局: 来自百度词典的官方解释:◎ 布局 bùjú: [distributi ...

  5. 无废话ExtJs 入门教程十三[上传图片：File]

    无废话ExtJs 入门教程十三[上传图片:File] extjs技术交流,欢迎加群(201926085) 1.代码如下: 1 <!DOCTYPE html PUBLIC "-//W3C ...

  6. 无废话ExtJs 入门教程十二[下拉列表联动：Combobox_Two]

    无废话ExtJs 入门教程十二[下拉列表联动:Combobox_Two] extjs技术交流,欢迎加群(201926085) 不管是几级下拉列表的联动实现本质上都是根据某个下拉列表的变化,去动态加载其 ...

  7. 无废话ExtJs 入门教程十一[下拉列表：Combobox]

    无废话ExtJs 入门教程十一[下拉列表:Combobox] extjs技术交流,欢迎加群(201926085) 继上一节内容,我们在表单里加了个一个下拉列表: 1.代码如下: 1 <!DOCT ...

  8. 无废话ExtJs 入门教程十[单选组：RadioGroup、复选组：CheckBoxGroup]

    无废话ExtJs 入门教程十[单选组:RadioGroup.复选组:CheckBoxGroup] extjs技术交流,欢迎加群(201926085) 继上一节内容,我们在表单里加了个一个单选组,一个复 ...

  9. 无废话ExtJs 入门教程九[数字字段：NumberField、隐藏字段Hidden、日期字段：DataFiedl]

    无废话ExtJs 入门教程九[数字字段:NumberField.隐藏字段Hidden.日期字段:DataFiedl] extjs技术交流,欢迎加群(201926085) 继上第六节内容,我们在表单里加 ...

随机推荐

  1. sublime-text3配置编译php

    在sublime-text中配置php的编译环境非常简单,只需要新建一个build system就可以了 步骤: 1. 工具->编译系统->新编译系统,将默认的内容替换为如下代码:蓝字部分 ...

  2. CentOS 7 运行级别切换

    CentOS 7 之前的版本是通过 /etc/inittab 文件来定义系统运行级别: [sywu@wusuyuan ~]$ cat /etc/centos-release CentOS releas ...

  3. [k]web页面-browser兼容问题-1

    1:空的a标签在IE7/8下不能点击(2015-05-22) html代码: <ul class='oUl'><li><a href="#"> ...

  4. SQL merge into 表合并

    Merge关键字是一个神奇的DML关键字.它在SQL Server 2008被引入,它能将Insert,Update,Delete简单的并为一句.MSDN对于Merge的解释非常的短小精悍:”根据与源 ...

  5. Sparse Matrix Multiplication

    Given two sparse matrices A and B, return the result of AB. You may assume that A's column number is ...

  6. Wince常见操作

    1.获取本地代码启动路径 //在代码启动路径下存在 Files 文件夹 Path.GetDirectoryName(Assembly.GetExecutingAssembly().GetName(). ...

  7. mybatis Result Maps collection already contains value for com.ebways.dictionary.dao.impl.PtInfoDaoImpl.beanMap

    java.lang.IllegalStateException: Failed to load ApplicationContext at org.springframework.test.conte ...

  8. 77 找出最大连续自然数个数[Longest Consecutive Sequence in an Unsorted Array]

    [本文链接] http://www.cnblogs.com/hellogiser/p/Longest-Consecutive-Sequence-in-an-Unsorted-Array.html [题 ...

  9. iOS 关于iphone6 和 iphone6 plus 的适配

    http://www.ui.cn/detail/26980.html 根据上面说的,iphone6 plus的屏幕的编程时的宽度应该是414,我理解的也是这样,但是我用iphone6 plus 模拟器 ...

  10. vs2013 控制台程序exe图标

    工程右击选择添加resource->Icon. 在工程目录就会生成  工程名.rc 和 XX.ico文件. 重新编译程序,就会生成有图标的exe. 对应的配置在  工程名.rc  文件里,用记事 ...