Ajax 註冊架構

Asp.net通過驗證控制項在用戶端實現一些註冊資訊的驗證，在驗證範圍上具有一定的限制。比如說使用者名稱是否重複，所有的使用者資訊是儲存在伺服器資料庫中，所以需要訪問伺服器，單純的驗證控制項無法實現。按照普通的動態網頁的實現原理，用戶端提交資訊，伺服器端接收資訊進行相應的處理，再返回資料給用戶端，在註冊功能中無法實現無重新整理的註冊資訊即時驗證。

      Ajax提供用戶端與伺服器端的非同步資訊交換可以實現註冊資訊即時動態驗證。在這裡我們採用AjaxPro.Net架構，下面以使用者名稱驗證功能來說明：

1 UserRegister.aspx：

<asp:TextBox ID="txtUserName" runat="server"  Height="21px" onkeyup="VerifyUsername(this.value)" ></asp:TextBox>

 

function VerifyUsername(name)
{
   UserRegister.GetReturnCode(name, IsUsernameExist_callback);
}

UserRegister為註冊頁面名稱，GetReturnCode為後台C#代碼

參數name為當前編輯框中輸入的使用者名稱，IsUsernameExist_callback為處理GetReturnCode返回資訊的函數。

 

Code
function IsUsernameExist_callback(res)
       {
            var msg = document.getElementById("<%=lblMsgUserName.ClientID %>");//lblMsgUserName:顯示驗證資訊
            var bRet = res.value;//提取伺服器端返回的值
          
            switch(bRet)//根據返回的值顯示相應的驗證資訊
            {
                case "Valid":
                    msg.innerHTML = '輸入合法';
                    break;
                case "Exist":
                    msg.innerHTML = '使用者名稱已存在，請使用其他登陸使用者名稱！';
                    break;
                case "NoValid":
                    msg.innerHTML = '使用者名稱長度必須在3到15之間！';
                    break;
                case "Empty":
                    msg.innerHTML = '不可為空！';
                    break;
            }   
       }

2 UserRegister.aspx.cs：

Code
 [AjaxPro.AjaxMethod]//AjaxPro.Net方法聲明
    public string GetReturnCode(string strVal)
    {
        if (strVal.Equals(string.Empty))
        {
            return "Empty";
        }
        else if (!IsValidUsername(strVal))//驗證使用者名稱輸入格式
        {
            return "NoValid"; 
        }
        else if (IsUsernameExist(strVal))//驗證資料庫中是否存在此使用者名稱
        {
            return "Exist";
        }
        else
        {
            return "Valid";//合法
        }                    
    }