var loginForm = Ext.create('Ext.form.Panel', {

        title: '单行输入',

        renderTo: Ext.getBody(),

        bodystyle: 'padding 5 5 5 5',

        width: 200,

        height: 120,

        defaultType: 'textfield',//表单字段默认类型

        frame: true,

        defaults: {

            labelWidth: 50,

            width: 150,

            labelSeparator: ':',

            labelAlign: 'left',

            allowBlank: false,

            blankText: "No blank",

            msgTarget: 'qtip'

        },

        items: [//selectOnFocus当表单项获得焦点时(在这里即是向输入框内输入用户名),获取表单项内所有内容。这样提取出了内容之后才有正则表达的‘材料’呀。

            { fieldLabel: '用户名', name: 'username', regex: /^([\w]+)(.[\w]+)*@([\w-]+\.){1,5}([a-zA-Z]){2,4}$/, regexText: '格式错误', selectOnFocus: true },

            { fieldLabel: '密码', name: 'password', inputType: 'password' }//name为表单项名称,标识表单,在使用setValues修改表单项字段

             //input为字段类型,默认为text                                             //值时,用于向函数说明修改哪个表单

        ]                                                     //inputType  输入栏的类型属性---例如radio,checkbox,text,password,file,

        //                                                        默认是text

,

        buttons: [{

            

            text: "登陆",

            handler: function () { loginForm.getForm().setValues({ username: 'user@com', password: '123456' });alert(typeof login.getForm()) }

        }]//setValues用于批量表单项字段的值,参数为表单项名称:‘’的json对象或者是或者是数组[{id:'001',value:'user@com'}]

    });//getForm()用于表单面板获取对应的基本表单对象,即formPannel(Ext.form.pannel别名)只有调用了该函数才能对表单元素进行操作

Extjs文本输入框的更多相关文章

  1. Text input(文本输入框)

    Text input(文本输入框)是用来获得用户输入的绝佳方式. 你可以用如下方法创建: <input type="text"> 注意,input元素是自关闭的.

  2. Android文本输入框(EditText)切换密码的显示与隐藏

    package cc.c; import android.app.Activity; import android.os.Bundle; import android.text.Selection; ...

  3. JS 文本输入框放大镜效果

    JS 文本输入框放大镜效果 今天下午研究了下 "文本输入框放大镜效果" 当然KISSY官网也有这种组件 请看kissy demo 其实这种效果 对于很多童鞋来说 应该并不陌生!我今 ...

  4. HTML中&lt;input&gt;參数,以及文本输入框,文本域的解说

    <form> <input type="text/password" name="名称" value="文本" /> ...

  5. iOS 删除黑色边框线导航栏&amp;删除搜索框的阴影边界线和中黑色文本输入框 - 解

    删除黑色边框线导航栏 in viewDidload: [self.navigationController.navigationBar setBackgroundImage:[[UIImage all ...

  6. ie 浏览器文本输入框和密码输入框的默认样式

    登录页在ie浏览器上的默认样式 输入框后面的X    密码框后面的眼睛 如下图 解决方案 /*ie文本框背景色*/ input::-ms-clear { display: none; } /*ie文本 ...

  7. 背水一战 Windows 10 (105) - 通知(Toast): 带按钮的 toast, 带输入的 toast(文本输入框,下拉选择框)

    [源码下载] 背水一战 Windows 10 (105) - 通知(Toast): 带按钮的 toast, 带输入的 toast(文本输入框,下拉选择框) 作者:webabcd 介绍背水一战 Wind ...

  8. html禁止文本输入框记录输入记录,单击input出现输入过的记录

    其实方法很简单,只需要在input文本输入框中加一条autocomplete="off"属性即可. <input type="text" name=&qu ...

  9. jQuery 判断文本输入框的事件

    1.实现以下需求: 输入框中输入内容,发表按钮变为蓝色背景,删除为空则变为原来的颜色 代码实现:通过判断event.target.value是否为空 2.input事件:文本输入框正在输入时生效  f ...

随机推荐

  1. EmguCV学习——简单算法 差分与高斯

    公司项目需要检测运动物体,我对opencv也没啥研究,google了好久看了好多方法,最简单的就是差分与高斯背景建模了. 旁边搞c++的同事正在搞更nb的算法,等出来了 我再转成C#版的分享. 先看差 ...

  2. [原创]使用benchmarksql和pgbench对PostgreSQL Plus Advanced Server进行性能测试

    一.测试环境 benchmarksql version:4.0.8 rhel 6.3 vmware esxi 二.理解benchmarksql性能测试原理TPC-C 1.理解TPC-C TPC-C模拟 ...

  3. Java Collections Source Code Series 1 --- 简介

    废话开篇 由于项目需要,需要对Java Collections进行系统地了解,所以在此记录下,方便自己,服务他人. Java Collections 简介 Java Collections 框架主要包 ...

  4. AIDL与service

    Service:Local service,一个进程中的多线程服务. AIDL:remote service,不同进程间通信. Service启动方法: startService():调用方destr ...

  5. Linux: uid/euid/suid的关系

    三种进程用户的简单解释:三种用户/组ID:uid/gid: 实际用户/组IDeuid/egid: 有效用户/组ID, 进程执行某个应用的用户/组ID.suid/sgid: 设置用户/组ID, 应用所属 ...

  6. [DHCP服务]——DHCP详解

    DHCP:(Dynamic Host Configuration Protocol) 动态主机配置协议 1. DHCP是一个局域网的网络协议,采用UDP协议工作 2. DHCP作用 (1)主要应用在大 ...

  7. 微软职位内部推荐-Software Engineer II-Office Incubation

    微软近期Open的职位: Office China team is looking for experienced engineers to improve consumer experience i ...

  8. Spring集成hibernate错误

    八月 25, 2016 7:55:31 下午 org.apache.tomcat.util.digester.SetPropertiesRule begin警告: [SetPropertiesRule ...

  9. 转载:js动态获取图片长宽尺寸(兼容所有浏览器,速度极快)

    转自:http://blog.phpdr.net/js-get-image-size.html lightbox类效果为了让图片居中显示而使用预加载,需要等待完全加载完毕才能显示,体验不佳(如fili ...

  10. 9、android开发之java.lang.verifyError(转载)

    原文链接: http://www.linuxidc.com/Linux/2012-08/67289.htm 解决方案: 最近在做一个Android开发小项目的时候,遇到java.lang.verify ...