ext js 用户验证

《ext js 用户验证》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、今天我们介绍的是Ext,作为一个功能强大的Ajax框架Ext拥有华丽的界面可以用在富客户端的开发上，彻底颠覆了人们对js的认识“原来脚本也不是想象中的麻烦”。如今已经有Ext2.2的版本了。在Ext2.2的版本中添加了许多新的特性，特别是对GMap的支持,获得更多的信息请访问Ext官网、Ext中文社区。下面介绍一个基于Ext2.1进行用户验证注册的例子：一、主界面设计：                            (图一)                       (图二)         (图三)                 

2、      (图四)         (图五)以上的五张图就为我们完整的展示了这个例子,接下来我们着重介绍代码部分。二、代码逻辑设计：   1   2      Ext.onReady(function(){  3         Ext.QuickTips.init();  4         Ext.form.Field.prototype.msgTarget = 'side';  5           6        var IsExsit=false;  7      

3、  var regform=new Ext.form.FormPanel({         8                labelWidth:80,  9                frame:true , 10                 monitorValid:true, //进行表单验证 11                defaultType:'textfield',  12                items:[{ 13                  fieldLabel:"用户名", 14       

4、           id:"txtusername", 15                  name:"username", 16                  width:150, 17                  labelAlign:"right", 18                  validator :function() 19                  { 20                    //本方法亦可以使用下面被注释的部分代替 21                  var usernam

5、e = Ext.get('username').dom.value; 22                  Ext.Ajax.request({ 23                     url:'CheckUserName.aspx', 24                     params:{name:username}, 25                     success: function(response, options) {             26                        var d

6、ata = Ext.util.JSON.decode(response.responseText);              27                        if(data.success == true)  ReturnValue(true); 28                        else ReturnValue(false);//不能在success方法里面直接返回。 29                     }   30                 }); 31                

7、function ReturnValue(ok){ 32               IsExsit = ok; 33             } 34             return IsExsit;  35                  }, 36                  invalidText:"用户已经存在", 37                  emptyText:"请输入用户名" , 38                  allowBlank:false , 39                  blan

8、kText:"请输入用户名！" 40                }, 41                { 42