zoukankan      html  css  js  c++  java
  • 无废话ExtJs 入门教程四[表单:FormPanel]

    extjs技术交流,欢迎加群(201926085)程序员俱乐部-ExtJs(5群)

    继上一节内容,我们在窗体里加了个表单。如下所示代码区的第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                  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 组件常用的:属性、方法及事件

    一、属性

    整型,表单宽度。

    height:整型,表单高度。

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

    二、方法

    reset:表单重置。

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

    submit:表单提交。

    活到老,学到老,练到老...
  • 相关阅读:
    小球下落
    生成1~n的排列
    hdu1871无题
    android本地定时通知
    php 5.3起弃用session_register
    centos 6.3 编译安装 nginx +mysql + php
    skynet网络库socketserver
    mac下通过docker搭建LEMP环境
    Git操作
    iOS本地通知
  • 原文地址:https://www.cnblogs.com/husam/p/5583517.html
Copyright © 2011-2022 走看看