Ext做密码验证

endeavor416

浏览: 64386 次
性别:
来自: 广州

最近访客更多访客>>

sinner

windgoogle

zlathere

hijackwust

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

ExtJs

EXT JavaScript CSS HTML prototype

1.完全从Ext的example包中发现的

2.js

   /*
* Password Verification
* @author xi
* @created on Oct 31 2008, 03:13 PM
*/

// Add the additional 'advanced' VTypes
Ext.apply(Ext.form.VTypes, {
    //增加密码的验证
password: function(val, field) {
    if (field.initialPassField) {
      var pwd = Ext.getCmp(field.initialPassField);
      return (val == pwd.getValue());
    }
    return true;
},

passwordText: 'Passwords do not match'
});

Ext.onReady(function(){

    Ext.QuickTips.init();

    // turn on validation errors beside the field globally
    Ext.form.Field.prototype.msgTarget = 'side';

    var bd = Ext.getBody();

    /*
     * ================ Password Verification =======================
     */

    var pwd = new Ext.FormPanel({
      labelWidth: 125,
      frame: true,
      title: 'Password Verification',
      bodyStyle:'padding:5px 5px 0',
      width: 350,
      defaults: {
        width: 175,
        inputType: 'password'
      },
      defaultType: 'textfield',
      items: [{
        fieldLabel: 'Password',
        name: 'pass',
        id: 'pass'
      },{
        fieldLabel: 'Confirm Password',
        name: 'pass-cfrm',
        vtype: 'password',
        initialPassField: 'pass' // id of the initial password field
      }]
    });

    pwd.render('pw');
});

3.html页面

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Advance Form Example2</title>
        <link rel="stylesheet" type="text/css"
            href="resources/extjs/resources/css/ext-all.css" />
        <script type="text/javascript"
            src="resources/extjs/adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="resources/extjs/ext-all.js"></script>
        <script type="text/javascript" src="resources/js/pwdValidate.js"></script>
    </head>
    <body>
        <div id="pw" style="padding-top:20px">
    </body>
</html>