文档章节

WebQQ更新:用户注册功能

暗之幻影
 暗之幻影
发布于 2015/09/23 16:59
字数 1132
阅读 6
收藏 0

原文:http://www.abigdreamer.com/mywork/webqq-update-user-registration-function.html

 

本blog已转移到:造梦师http://www.abigdreamer.com,谢谢大家的支持,欢迎大家以后常去我的小站转转!

 

本次更新==>用户注册功能:
1.AJAX自动检测用户名是否存在




2.密码强度检测功能





AJAX自动检测用户名是否存在的说明:
实现了输入框改内容变后就发送请求,否则不发送。主要改变的就是加颜色的部分,思路就是将输入框的内容备份一份,然后验证的时候,取出输入框的内容与备份的内容比较,如果相同就返回,即不发送请求,否则想后台发送请求,希望对需要的朋友有帮助:

Register = function() {
    var regForm, regWindow;
   var account;
    var couldRegister;

    var buildForm = function() {
        regForm = new Ext.FormPanel({
            // title:'用户表单',
            monitorValid : true,
            labelWidth : 80,
            // baseCls : 'x-plain',
            labelAlign : 'left',
            buttonAlign : 'center',
            bodyStyle : 'padding:5px;',
            width : 600,
            frame : true,// 设置了面板的边角是圆弧过度的,底色, 窗口是否显示背景色
            labelWidth : 80,
            // 容器中组件默认统一配置选项
            defaults : {
                allowBlank : false
            // 验证字段是否能为空
            },

            items : [{
                fieldLabel : '账号',
                id : 'account',
                name : 'account',
                xtype : 'textfield',
                blankText : '用户名不能为空!',
                validator : checkAccount,// 指定验证器
                invalidText : '用户名已经被注册!'
            }, {
                layout : 'column',// 在formpanel的itmes加入一个column的定义
                border : true,
                labelSeparator : ':',
                items : [{
                    columnWidth : .5,// 宽度50%
                    layout : 'form',
                    border : false,
                    items : [{
                        inputType : 'password',
                        fieldLabel : '密码',
                        id : 'password',
                        name : 'password',
                        xtype : 'textfield',
                        allowBlank : false,
                        blankText : '密码不能为空!'
                    }]
                }, {
                    columnWidth : .5,// 宽度50%
                    layout : 'form',
                    border : false,
                    items : [{
                        inputType : 'password',
                        fieldLabel : '确认密码',
                        id : 'affirmPassword',
                        name : 'affirmPassword',
                        xtype : 'textfield',
                        blankText : '确认密码不能为空!',
                        invalidText : '两次密码不一致!',
                        validator : function() {
                            if (Ext.get('password').dom.value == Ext
                                    .get('affirmPassword').dom.value)
                                return true;
                            return false;
                        }
                    }]
                }, {
                    columnWidth : .5,// 宽度50%
                    layout : 'form',
                    border : false,
                    items : [{
                        xtype : 'textfield',
                        fieldLabel : '真实姓名',
                        name : 'name',
                        anchor : '90%'
                    }]
                }, {
                    columnWidth : .25,// 宽度25%
                    layout : 'form',
                    border : false,
                    items : [{
                        style : 'margin-top:5px',
                        xtype : 'radio',
                        fieldLabel : '性别',
                        boxLabel : '男',
                        name : 'sex',
                        checked : true,
                        inputValue : '男',
                        anchor : '95%'
                    }]
                }, {
                    columnWidth : .25,// 宽度25%
                    layout : 'form',
                    labelWidth : 0,
                    labelSeparator : '',
                    hideLabels : true,// 不要Label
                    border : false,
                    items : [{
                        style : 'margin-top:5px',
                        xtype : 'radio',
                        fieldLabel : '',
                        boxLabel : '女',
                        name : 'sex',
                        inputValue : '女',
                        anchor : '95%'
                    }]
                }, {
                    columnWidth : .5,// 宽度50%,新起一行
                    layout : 'form',
                    border : false,
                    items : [{
                        xtype : 'datefield',// 日期型
                        fieldLabel : '出生日期',
                        name : 'birthday',
                        anchor : '90%'
                    }]
                }, {
                    columnWidth : .5,
                    layout : 'form',
                    border : false,
                    items : [{
                        xtype : 'combo',
                        fieldLabel : '学历',
                        name : 'education',
                        anchor : '90%'
                    }]
                }, {
                    columnWidth : .35,
                    layout : 'form',
                    border : false,
                    items : [{
                        xtype : 'checkbox',
                        fieldLabel : '权限组',
                        boxLabel : '系统管理员',
                        name : 'popedom',
                        inputValue : '1',
                        anchor : '95%'
                    }]
                }, {
                    columnWidth : .2,
                    layout : 'form',
                    labelWidth : 0,
                    labelSeparator : '',
                    hideLabels : true,
                    border : false,
                    items : [{
                        xtype : 'checkbox',
                        fieldLabel : '',
                        boxLabel : '管理员',
                        name : 'pepedom',
                        inputValue : '2',
                        anchor : '95%'
                    }]
                }, {
                    columnWidth : .2,
                    layout : 'form',
                    labelWidth : 0,
                    labelSeparator : '',
                    hideLabels : true,
                    border : false,
                    items : [{
                        xtype : 'checkbox',
                        fieldLabel : '',
                        boxLabel : '普通用户',
                        name : 'pepedom',
                        inputValue : '3',
                        anchor : '95%'
                    }]
                }, {
                    columnWidth : .25,
                    layout : 'form',
                    labelWidth : 0,
                    labelSeparator : '',
                    hideLabels : true,
                    border : false,
                    items : [{
                        xtype : 'checkbox',
                        fieldLabel : '',
                        boxLabel : '访客',
                        name : 'pepedom',
                        inputValue : '4',
                        anchor : '95%'
                    }]
                }, {
                    columnWidth : .8,// 宽度50%
                    layout : 'form',
                    border : false,
                    items : [{
                        xtype : 'textfield',
                        fieldLabel : '电子邮件',
                        vtype : 'email',
                        // regex : /^\d+$/, // 正则表达式,这里没有详细写,只是验证了数字
                        // regexText : '电子邮件格式错误!',
                        name : 'name',
                        anchor : '90%',
                        blankText : '电子邮件不能为空'
                    }]
                }, {
                    columnWidth : .8,// 宽度50%
                    layout : 'form',
                    border : false,
                    items : [{
                        xtype : 'textfield',
                        fieldLabel : '个人主页',
                        vtype : 'url',
                        name : 'name',
                        anchor : '90%'
                    }]
                }]
            }],
            buttons : [{
                text : '注册',
//                type : 'submit',
                formBind : true,
                handler : register
            }, {
                text : '清空',
                handler : function() {
                    regForm.form.reset();
                }
            }]
        });
    };

    // 检查用户名是否存在
  var checkAccount = function(e) {
        var accountTemp = Ext.get('account').dom.value;

        if (account != accountTemp) {
            account = accountTemp;

            Ext.Ajax.request({
                url : 'WebQQServlet?method=checkAccount',
                params : {
                    account : account
                },
                success : function(response, options) {
                    var responseArray = Ext.util.JSON
                            .decode(response.responseText);
                  if (responseArray.success == false) { // 用户名已经被注册
                        couldRegister = false; 
                  } else {// 用户名可以注册
                        couldRegister = true; 
                  }

                }
            });
      }

        return couldRegister;
  };
   
    // 单击按钮时执行登陆操作
    var register = function() {
        // 执行当前表单面板的submit
        regForm.getForm().submit({
            waitTitle : '系统提示',
            waitMsg : '正在登录,请等待...',// 动作发生期间显示的文本信息
            url : 'WebQQServlet?method=register',// submit发生时指向的地址logon?cmd=adminLogin
            method : 'POST',// 表单提交方式
            // Functions that fire (success or failure) when the server
            // responds.
            // The one that executes is determined by the
            // response that comes from Logon.do as seen below. The server would
            // actually respond with valid JSON,
            // something like: response.write "{ success: true}" or
            // response.write "{ success: false, errors: { reason: 'Login
            // failed. Try again.' }}"
            success : function(form, action) {// 数据验证通过时发生的动作
                window.location = 'webQQ.jsp?account='
                        + Ext.get("account").getValue();
            },
            // Failure function, see comment above re: success and failure.
            // You can see here, if login fails, it throws a messagebox
            // at the user telling him / her as much.
            failure : function(form, action) {
                if (action.failureType == 'server') {
                    obj = Ext.util.JSON.decode(action.response.responseText);
                    Ext.Msg.alert('登录失败', obj.errors.reason, function() {
                        form.findField('userAccount').focus();
                    });
                } else {
                    Ext.Msg.alert('Warning!',
                            'Authentication server is unreachable : '
                                    + action.response.responseText);
                }
                // if (action.failureType == Ext.form.Action.SERVER_INVALID)
                // Ext.MessageBox.alert('警告', action.result.errors.msg);
                longinFormPanel.getForm().reset();
            }
        });
    };

    var buildWin = function() {
        regWindow = new Ext.Window({
            id : 'regwin',
            title : '注册',
            layout : 'fit',
            // width : 320,
            height : 280,
            bodyStyle : 'padding:4px',
            maximizable : false,
            closeAction : 'close',
            closable : false,
            collapsible : true,
            buttomAlign : 'right',
            plain : true,
            items : regForm
        });
    };

    return {
        init : function() {
            Ext.BLANK_IMAGE_URL = '../plugins/extjs/ext-2.0/resources/images/default/s.gif';
            Ext.QuickTips.init();
            Ext.form.Field.prototype.msgTarget = 'side';
            // 改变主题为紫色
            // Ext.util.CSS.swapStyleSheet("theme",
            // "../plugins/extjs/ext-2.0/resources/css/xtheme-purple.css");
            // Ext.util.CSS.swapStyleSheet("theme",
            // "../plugins/extjs/ext-2.0/resources/css/xtheme-slickness.css");
            buildForm();
            buildWin();

            // 最后把窗口面板显示出来
            regWindow.show();
        }
    }
}();

Ext.onReady(Register.init, Register);

 

本文转载自:http://depravedangel.iteye.com/blog/416851

暗之幻影
粉丝 20
博文 377
码字总数 71245
作品 0
南京
高级程序员
私信 提问
python-gui-webqq

1,目前还有一个接收消息的功能 没有写。 2,群组没有,我会加上的。 3,没有qq头象抖动,这个还不会,会的朋友可以教教我。 4,这是基于python2.7写的webqq,所有接口都是使用的webqq协议。 ...

匿名
2011/11/11
5.8K
0
雨林木风 OS 3.0 beta2 发布

在Beta1发布后的这段时间内,我们收到 大量用户的测试反馈,目前修复了已存在问题并进一步增强系统性能,完善细节。 本次更新主要体现在以下几个方面: 功能添加: winetricks 用WineTricks令...

红薯
2010/05/23
2.1K
7
Ubuntu Linux下的QQ使用方案

这个世界上有两只出名的企鹅,一只是为全世界作出巨大贡献的Linux企鹅,另外一只则是在中国IT行业对同行赶尽杀绝的QQ企鹅,可能是因为基情的关系,QQ从来没给Linux好脸色过,其旗下的重要客户...

acmfly
2012/07/06
300
0
sjdy521/Mojo-Webqq

Mojo-Webqq v2.1.1 使用Perl语言编写的Smartqq客户端框架,基于Mojolicious,要求Perl版本5.10+,可通过插件提供基于HTTP协议的api接口供其他语言或系统调用 郑重声明 本项目完全遵循QQ官方提...

sjdy521
2016/02/16
0
0
IQQ_V2.1 版本,即开即用的桌面QQ客户端

这是一个正在开发的项目,您可以把页面加入书签随时看看我们的进度,也希望您将来能够来看看我们最终的程序。 我们目标 提供一个基于WebQQ协议开发的库,您可以基于这个库让您的程序集成QQ相...

6208317
2013/08/11
13.3K
23

没有更多内容

加载失败,请刷新页面

加载更多

Excption与Error包结构,OOM 你遇到过哪些情况,SOF 你遇到过哪些情况

Throwable 是 Java 中所有错误与异常的超类,Throwable 包含两个子类,Error 与 Exception 。用于指示发生了异常情况。 Java 抛出的 Throwable 可以分成三种类型。 被检查异常(checked Exc...

Garphy
今天
5
0
计算机实现原理专题--二进制减法器(二)

在计算机实现原理专题--二进制减法器(一)中说明了基本原理,现准备说明如何来实现。 首先第一步255-b运算相当于对b进行按位取反,因此可将8个非门组成如下图的形式: 由于每次做减法时,我...

FAT_mt
昨天
6
0
好程序员大数据学习路线分享函数+map映射+元祖

好程序员大数据学习路线分享函数+map映射+元祖,大数据各个平台上的语言实现 hadoop 由java实现,2003年至今,三大块:数据处理,数据存储,数据计算 存储: hbase --> 数据成表 处理: hive --> 数...

好程序员官方
昨天
7
0
tabel 中含有复选框的列 数据理解

1、el-ui中实现某一列为复选框 实现多选非常简单: 手动添加一个el-table-column,设type属性为selction即可; 2、@selection-change事件:选项发生勾选状态变化时触发该事件 <el-table @sel...

everthing
昨天
6
0
【技术分享】TestFlight测试的流程文档

上架基本需求资料 1、苹果开发者账号(如还没账号先申请-苹果开发者账号申请教程) 2、开发好的APP 通过本篇教程,可以学习到ios证书申请和打包ipa上传到appstoreconnect.apple.com进行TestF...

qtb999
昨天
10
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部