Ajax即时实现服务端数据验证(Asp.net 2.0)(示例代码下载)

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› ASP.NET›ASP.NET编程经验

原作者: [db:作者] 来自: [db:来源] 收藏邀请

(一) . 运行效果如下:

(二). 代码

1. 页面 *.aspx 前台代码如下:

1<body>
2    <form id="form1" runat="server">
3    <script type="text/javascript">
4        var cbo = new CallBackObject();
5        cbo.OnComplete=Cbo_Complete;
6        cbo.OnError=Cbo_Error;
7        function CheckUserName(UserName)
8>

2. 页面 *.aspx.cs后台代码如下:

1  1public partial class _Default : System.Web.UI.Page
2  2{
3  3    protected void Page_Load(object sender, EventArgs e)
4  4    {
5  5       tbUsername.Attributes.Add("OnKeyUp", "CheckUserName(this.value)");
6  6    }
7  7   protected void tbUsername_TextChanged(object sender, EventArgs e)
8  8   {
9  9      if (!CallBackHelper.IsCallBack)
10 10         return;
11 11
12 12      string strName = tbUsername.Text;
13 13
14 14      try
15 15      {
16 16         string strReturnCode;
17 17         if (!IsValidUsername(strName))
18 18         {
19 19            strReturnCode = "1";
20 20         }
21 21         else if (!IsUsernameExist(strName))
22 22         {
23 23            strReturnCode = "2";
24 24         }
25 25         else
26 26         {
27 27            strReturnCode = "0";
28 28         }
29 29         CallBackHelper.Write(strReturnCode);
30 30      }
31 31      catch (Exception ex)
32 32      {
33 33         CallBackHelper.HandleError(ex);
34 34      }
35 35   }
36 36   private bool IsUsernameExist(string strUsername)
37 37   {
38 38      bool bRet = false;
39 39
40 40      switch (strUsername.ToUpper())
41 41      {
42 42         case "KING":
43 43         case "ROSE":
44 44         bRet = true;
45 45         break;
46 46      }
47 47
48 48      return bRet;
49 49   }
50 50
51 51   private bool IsValidUsername(string strUsername)
52 52   {
53 53      return (Regex.IsMatch(strUsername, @"^(\w{3,15})$"));
54 54   }
55 55}

3. Ajax主要的JS文件代码如下:

  1   1 // JScript File
  2   2 function CallBackObject()
  3   3 {
  4   4     this.XmlHttp = this.GetHttpObject();
  5   5 }
  6   6 CallBackObject.prototype.GetHttpObject = function()
  7   7 {
  8   8     var xmlhttp;
  9   9       /*@cc_on
10  10       @if (@_jscript_version >= 5)
11  11         try {
12  12           xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
13  13         } catch (e) {
14  14           try {
15  15             xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
16  16           } catch (E) {
17  17             xmlhttp = false;
18  18           }
19  19         }
20  20       @else
21  21       xmlhttp = false;
22  22       @end @*/
23  23     if( !xmlhttp && typeof XMLHttpRequest != 'undefined' )
24  24     {
25  25         try
26  26         {
27  27             xmlhttp =  new XMLHttpRequest();
28  28         }
29  29         catch( e )
30  30         {
31  31             xmlhttp = false;
32  32         }
33  33     }
34  34     return xmlhttp;
35  35 }
36  36 CallBackObject.prototype.DoCallBack = function( eventTarget,eventArgument)
37  37 {
38  38     var theData = '';
39  39     var theform = document.forms[0];
40  40     var thePage = window.location.pathname + window.location.search;
41  41     var eName = '';
42  42     theData = '__EVENTTARGET=' + escape(eventTarget.split("$").join(":")) + '&';
43  43     theData += '__EVENTTARGUMENT=' + eventArgument + '&';
44  44
45  45     theData += '__VIEWSTATE=' + escape(theform.__VIEWSTATE.value).replace(new RegExp('\\+','g'),'%2b') + '&';
46  46     theData += 'IsCallBack=true&';
47  47     for(var i = 0; i < theform.elements.length; i++)
48  48     {
49  49         eName = theform.elements[i].name;
50  50         if( eName && eName != '')
51  51         {
52  52             if( eName == '__EVENTARGET' || eName == '__EVENTARGUMENT' || eName == '__VIEWSTATE' )
53  53             {
54  54             }
55  55             else
56  56             {
57  57                 theData = theData + escape(eName.split("$").join(":")) + '=' + theform.elements[i].value;
58  58                 if( i!= theform.elements.length - 1 )
59  59                 {
60  60                     theData = theData + '&';
61  61                 }
62  62             }
63  63         }
64  64     }
65  65     if( this.XmlHttp )
66  66     {
67  67         if( this.XmlHttp.readyState == 4 || this.XmlHttp.readyState == 0 )
68  68         {
69  69             var oThis = this;
70  70             this.XmlHttp.open('POST', thePage, true);
71  71             this.XmlHttp.onreadystatechange = function()
72  72             {
73  73                 oThis.ReadyStateChange();
74  74             };
75  75             this.XmlHttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
76  76             this.XmlHttp.send( theData );
77  77         }
78  78     }
79  79 }
80  80
81  81 CallBackObject.prototype.AbortCallBack = function()
82  82 {
83  83     if( this.XmlHttp )
84  84     {
85  85         this.XmlHttp.abort();
86  86     }
87  87 }
88  88
89  89 CallBackObject.prototype.OnLoading = function()
90  90 {
91  91 }
92  92
93  93 CallBackObject.prototype.OnLoaded = function()
94  94 {
95  95 }
96  96
97  97 CallBackObject.prototype.OnInteractive = function()
98  98 {
99  99 }
100 100
101 101 CallBackObject.prototype.OnComplete = function( responseText, responseXml)
102 102 {
103 103 }
104 104
105 105 CallBackObject.prototype.OnAbort = function()
106 106 {
107 107 }
108 108
109 109 CallBackObject.prototype.OnError = function( status, statusText)
110 110 {
111 111 }
112 112
113 113 CallBackObject.prototype.ReadyStateChange = function()
114 114 {
115 115     if( this.XmlHttp.readyState == 1 )
116 116     {
117 117         this.OnLoading();
118 118     }
119 119     else if( this.XmlHttp.readyState == 2 )
120 120     {
121 121         this.OnLoaded();
122 122     }
123 123     else if( this.XmlHttp.readyState == 3 )
124 124     {
125 125         this.OnInteractive();
126 126     }
127 127     else if( this.XmlHttp.readyState == 4 )
128 128     {
129 129         if( this.XmlHttp.status == 0 )
130 130         {
131