数据验证(模拟检测用户名是否存在)

      数据验证涉及到很多方面的东西，在当前的技术领域里，从技术上来看可以说是分为传统的验证（同步方式）和Ajax（异步方式）验证。如果从功能验证上来看的话就包罗万象了。比如非空验证，对等验证，格式验证等等。在.NET里还有专门用于验证的的几个常见验证控件，RequiredFieldValidator，RangeValidator，RegularExpressionValidator，CompareValidator，CustomValidator以及ValidationSummary等，这里不讨论他们的使用及原理。

一. 传统的验证方式
     在传统的验证中是采用同步表单提交的方法来处理的验证请求。这种验证方式的缺点很显然而知了。表单提交一是传输的数据量比较大消耗资源，二是页面处于同步方式随着表单的提交会刷新页面。下面我看来看看一个简单的传统验证的实例：
    建议一个ASP.NET项目，将默认页面改名为：TraditValidation.aspx，在页面.cs里定义一个模拟数据的方法如下：

 1}

     接下来转到TraditValidation.aspx的html视图下，定义一个JavaScript方法来验证输入数据的合法性。

<script language="javascript">
function checkFrm()
script>

    转到设计视图，给页面上放置两个Lebal,一个TextBox,一个Button控件并适当的设置属性，html代码如下：

<form id="Form1" method="post" runat="server" onsubmit="return checkFrm()">
<asp:Label id="Label2" runat="server" Font-Names="黑体" Font-Bold="True" Font-Size="X-Large">传统的数据验证</asp:Label>
<hr>
<div>用户名：</div>
<asp:textbox id="tbUsername" runat="server"></asp:textbox>
<asp:button id="btnVerify" runat="server" Text="检查用户名" OnClick="btnVerify_Click"></asp:button>
<br>
<asp:label id="lblMessage" runat="server" ForeColor="Tomato"></asp:label>
</form>

    下面转到代码视图下去写btnVerify的单击事件方法：

 1protected void btnVerify_Click(object sender, EventArgs e)
 2}

     运行这个程序页面，当我门点击按扭的时候，提交表单并且页面刷新。下面是运行后的界面图：

-----------------------------------------------------------------------------------------------------------
二. Ajax验证方式
    上面的实例展示了传统的验证方式的过程，原理是用的表单提交同步的方法执行的。下面我们来看看Ajax的验证方式与传统的验证方式有什么不同，在上一篇文章中讲到XmlHttpRequest对象的异步请求实现Ajax功能。接下来还是通过一个使用XmlHttpRequest对象的实例来说明Ajax验证方法的过程。

    在上面建立的ASP.NET项目里新建立一个一般处理程序文件，命名为：AjaxHandler.ashx，同上在里面定义一个模拟数据字典的方法用来检测用户名是否存在IsUsernameExist(string strUsername)和一个验证数据合法性的方法IsValidUsername(string strUsername);详细定义如下：

    IsUsernameExist()方法的详细定义：

 1    }

     IsValidUsername()方法的详细定义：

1    }

       见于Ajax的运行步骤：创建对象---发送请求---响应请求---处理返回数据。
      下面我们来看看客户端JavaScript方法的定义，第一篇文章里我提过，要使用一个对象事先得创建一个对象的实例吧，在这里又将使用到XmlHttpRequest对象，所以我门先来定义一个方法创建XmlHttpRequest对象：

 1    var xmlHttp;
 2    function createXMLHttpRequest()
 3    }

       定义一个向服务器发送请求的方法；

 1    //处理方法
 2    function CheckUsername()
 3    }

     
       到这里通过分析上面的方法，已经创建好了XmlHttpRequest对，并定义好了向服务器发送请求的方法，指定了想AjaxHandler.ashax发起请求并传递一个参数给服务器端。那服务器是怎么处理这个请求的呢？下面我们来看看服务器端的处理过程的定义，在一般处理程序里，当请求发送给他过后是通过其内的一个叫ProcessRequest () 的方法来处理的，那么在这里我门要处理客户端发送过来的请求，是不是就应该修改ProcessRequest()方法的实现呢？答案是肯定的，如下：

 1    public void ProcessRequest (HttpContext context) 
 2    }

       分析上面代码，如果用户名不合法则返回1，如果存在则返回2，否则返回0，那么客户端的处理返回该怎么去定义呢？很显然是依赖于服务器端返回的这些数据了。客户端回调方法的详细定义如下：

 1//回调方法
 2function ShowResult()
 3}

      到这里客户端方法和服务器处理程序都OK了，下面我门在客户段来调用方法向服务器发送请求看看效果：

<form id="form1" runat="server">
    <asp:Label id="Label2" runat="server" Font-Names="黑体,Arial Black" Font-Bold="True" Font-Size="X-Large">
       基于AJAX的数据验证</asp:Label>
    <hr>
    <asp:Label id="Label1" runat="server">用户名：</asp:Label>
    <input id="tbUsername" type="text" onkeyup="CheckUsername(this.value)"/>
    <br>

    <div id="msg"></div>
    </form>

       运行结果如下所示：


本文实例源代码下载