ASP.NET 2.0 使用AJAX对用户名,Email进行验证

很多网站都使用了ajax技术进行数据验证,如淘宝网站。那么我们如果使用ASP.NET怎样实现这样的效果呢?
1、在用户名框输入An两个字符,系统立刻无刷新响应错误提示"少于3个字符"

2、当我接着输入“dy”以完成用户名“Andy”的输入,系统立刻无刷新响应提示,系统进行了与数据库校验,发现用户名不存在,无刷新显示提示"用户名不存在,可以使用";

3、当我改为用户名“piaoyi”输入时,系统无刷新的提示“用户名存在”,也进行了与数据库的通讯;

AJAXPro.Net简介

         AJAXPro.Net是一个优秀的AJAX框架, 在实际应用中只要添加其DLL引用并进行简单的配置,

         即可以非常方便的在客户端直接调用服务端方法, 实现验证目的.

配置Web.config:

//VS.NET 2005中配置
<httpHandlers>
        <add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2" />           
</httpHandlers>

//VS.NET 2003中配置
<httpHandlers>
         <add verb="POST,GET" path="AJAXpro/*.ashx" type="AJAXPro.AJAXHandlerFactory, AJAXPro" />      
</httpHandlers>
//AjaxPro.dll和AjaxPro2.dll都上传到我的资源里面了,有需要的话,可以去下载~

代码实现:

1,aspx代码如下:

<% @ Page Language="C#" AutoEventWireup="true" CodeFile="Verify.ASPx.cs" Inherits="Verify"  %>

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xHTML1/DTD/xHTML1-transitional.dtd" >

< HTML  XMLns ="http://www.w3.org/1999/xHTML"   >
< head  runat ="server" >
     
< title > Verify </ title >
    
< script  language ="jscript" >
    
function VerifyUsername(name)
    
{
        Verify.GetReturnCode(name,IsUsernameExist_callback);
    }

    
    
function IsUsernameExist_callback(res)
    
{
        
var msg = document.getElementById("lblMessage");
        
var bRet = res.value;
        
if(bRet == "0")
        
{
            msg.innerHTML 
= "用户名存在!";
            msg.style.color 
= "green";
        }

        
else if(bRet == "1")
        
{
            msg.innerHTML 
= "用户名长度必须在3到15之间,且不包含字母、数字和下划线以外的字符!";
            msg.style.color 
= "red";
        }

        
else
        
{
            msg.innerHTML 
= "用户名不存在!";
            msg.style.color 
= "red";
        }

    }

    
</ script >
</ head >
< body >
    
< form  id ="form1"  runat ="server" >
    
< div >
        
< h1 > 基于Ajax的数据验证 </ h1 >
        
< hr  />
        
< ASP:Label  ID ="Label1"  runat ="server" > 用户名: </ ASP:Label >
        
< input  type ="text"  id ="tbUsername"  onkeyup ="VerifyUsername(this.value)"   />< br  />
        
< ASP:Label  ID ="lblMessage"  runat ="server" ></ ASP:Label >
    
</ div >
    
</ form >
</ body >
</ HTML >


2 .cs代码如下:

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HTMLControls;
using System.Text.RegularExpressions;

public partial class Verify : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        AjaxPro.Utility.RegisterTypeForAjax(typeof(Verify));
        //作用是向客户端输出下面的代码:
        //
< script  type ="text/JavaScript"  src ="/ajaxprotest/ajaxpro/prototype.ashx" ></ script >
        //
< script  type ="text/JavaScript"  src ="/ajaxprotest/ajaxpro/core.ashx" ></ script >
        //
< script  type ="text/JavaScript"  src ="/ajaxprotest/ajaxpro/converter.ashx" ></ script >
        //
< script  type ="text/JavaScript"  src ="/ajaxprotest/ajaxpro/Verify,App_Web_elgsobcn.ashx" ></ script >
    }

    //加上[AjaxPro.AjaxMethod],才能被客户端访问
    [AjaxPro.AjaxMethod]
    public string GetReturnCode(string strUsername)
    {
        if (!IsValidUsername(strUsername))
        {
            return "1";
        }
        else if (!IsUsernameExist(strUsername))
        {
            return "2";
        }
        else
        {
            return "0";
        }
    }

    private bool IsUsernameExist(string strUsername)
    {
        bool bRet = false;

        switch (strUsername.ToLower())
        {
            case "test":
            case "tom":
            case "jack":
            case "ajax":
            case "ASPnet":
            case "nic":
                bRet = true;
                break;
        }

        return bRet;
    }



    private bool IsValidUsername(string strUsername)
    {
        return (Regex.IsMatch(strUsername, @"^(/w{3,15})$"));
    }

    private bool IsValidEmail(string strEmail)
    {
        return (Regex.IsMatch(strEmail, @"^/w+((-/w+)(/./w+))*/@[A-Za-z0-9]+((/.-)[A-Za-z0-9]+)*/.[A-Za-z0-9]+$"));
    }

}


 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值