(一). 运行效果如下:
(二). AjaxPro.NET简介
AjaxPro.NET是一个优秀的Ajax框架, 在实际应用中只要添加其DLL引用并进行简单的配置,
即可以非常方便的在客户端直接调用服务端方法, 实现验证目的.
(三).使用AjaxPro.NET预配置
1. 添加 AjaxPro.dll 文件的引用(示例代码中已经包含,直接COPY过来使用即可).
2. 在Web.config文件中添加以下配置,
1
<
httpHandlers
>
2 < add verb = " POST,GET " path = " ajaxpro/*.ashx " type = " AjaxPro.AjaxHandlerFactory, AjaxPro " />
3 </ httpHandlers >
2 < add verb = " POST,GET " path = " ajaxpro/*.ashx " type = " AjaxPro.AjaxHandlerFactory, AjaxPro " />
3 </ httpHandlers >
3. 在要使用AjaxPro.NET框架的页面 *.aspx.cs 的 Page_Load事件中加如下代码:
AjaxPro.Utility.RegisterTypeForAjax(
typeof
(_Default));
4. 经过以上三步骤后, 只要在后台服务端的方法前面增加属性[AjaxMethod]后:
1
[AjaxMethod()]
//
or [AjaxPro.AjaxMethod]
2 public ArrayList GetSearchItems( string strQuery )
3 {
4 // 生成数据源
5 ArrayList items = new ArrayList();
6 items.Add( " King " );
7 items.Add( " Rose " );
8 return items ;
9 }
10
2 public ArrayList GetSearchItems( string strQuery )
3 {
4 // 生成数据源
5 ArrayList items = new ArrayList();
6 items.Add( " King " );
7 items.Add( " Rose " );
8 return items ;
9 }
10
就可以在客户端直接使用服务端方法, 非常方便, 客户端调用后台代码如下:
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
(四). 详细代码如下
1. 页面 AjaxPro.NETDataValidate.aspx 代码如下:
1
<
head runat
=
"
server
"
>
2 < title > AjaxPro.NET 数据验证 </ title >
3 < script language = " jscript " >
4 function IsUsernameExist_callback(result)
5 {
6 var msg = document.getElementById( ' lblMessage ' );
7 var value = result.value;
8 if ( value == ' 0 ' )
9 {
10 msg.innerHTML = ' 用户名合法! ' ;
11 msg.style.color = ' green ' ;
12 }
13 else if ( value == ' 1 ' )
14 {
15 msg.innerHTML = ' 用户名长度必须在 3 到 15 之间, 且不包含字母/数字/下划线以外的字符! ' ;
16 msg.style.color = ' red ' ;
17 }
18 else
19 {
20 msg.innerHTML = ' 用户名不存在! ' ;
21 msg.style.color = ' red ' ;
22 }
23 }
24
25 function VerifyUserName(name)
26 {
27 _Default.GetReturnCode(name, IsUsernameExist_callback);
28 }
29 </ script >
30 </ head >
31 < body >
32 < form id = " form1 " runat = " server " >
33 < div >
34 < asp:Panel ID = " Panel1 " runat = " server " BackColor = " #C0C0FF " Font - Bold = " True " Font - Overline = " False "
35 Font - Size = " XX-Large " Height = " 37px " Width = " 459px " >
36 AjaxPro.NET 数据验证 </ asp:Panel >
37 < br />
38 < hr align = " left " style = " width: 463px " />
39 < br />
40 输入用户名: & nbsp;
41 < asp:TextBox ID = " tbUsername " runat = " server " ></ asp:TextBox >< br />
42 < br />
43 < asp:Label ID = " lblMessage " runat = " server " Width = " 246px " ></ asp:Label ></ div >
44 </ form >
45 </ body >
2 < title > AjaxPro.NET 数据验证 </ title >
3 < script language = " jscript " >
4 function IsUsernameExist_callback(result)
5 {
6 var msg = document.getElementById( ' lblMessage ' );
7 var value = result.value;
8 if ( value == ' 0 ' )
9 {
10 msg.innerHTML = ' 用户名合法! ' ;
11 msg.style.color = ' green ' ;
12 }
13 else if ( value == ' 1 ' )
14 {
15 msg.innerHTML = ' 用户名长度必须在 3 到 15 之间, 且不包含字母/数字/下划线以外的字符! ' ;
16 msg.style.color = ' red ' ;
17 }
18 else
19 {
20 msg.innerHTML = ' 用户名不存在! ' ;
21 msg.style.color = ' red ' ;
22 }
23 }
24
25 function VerifyUserName(name)
26 {
27 _Default.GetReturnCode(name, IsUsernameExist_callback);
28 }
29 </ script >
30 </ head >
31 < body >
32 < form id = " form1 " runat = " server " >
33 < div >
34 < asp:Panel ID = " Panel1 " runat = " server " BackColor = " #C0C0FF " Font - Bold = " True " Font - Overline = " False "
35 Font - Size = " XX-Large " Height = " 37px " Width = " 459px " >
36 AjaxPro.NET 数据验证 </ asp:Panel >
37 < br />
38 < hr align = " left " style = " width: 463px " />
39 < br />
40 输入用户名: & nbsp;
41 < asp:TextBox ID = " tbUsername " runat = " server " ></ asp:TextBox >< br />
42 < br />
43 < asp:Label ID = " lblMessage " runat = " server " Width = " 246px " ></ asp:Label ></ div >
44 </ form >
45 </ body >
2. 页面 AjaxPro.NETDataValidate.aspx.cs 后台代码如下:
1
public
partial
class
_Default : System.Web.UI.Page
2 {
3 protected void Page_Load( object sender, EventArgs e)
4 {
5 AjaxPro.Utility.RegisterTypeForAjax( typeof (_Default));
6 tbUsername.Attributes.Add( " OnKeyUp " , " VerifyUserName(this.value) " );
7 }
8
9 [AjaxPro.AjaxMethod]
10 public string GetReturnCode( string strName)
11 {
12 if ( ! IsValidUsername(strName))
13 {
14 return " 1 " ;
15 }
16 else if ( ! IsUsernameExist(strName))
17 {
18 return " 2 " ;
19 }
20 else
21 {
22 return " 0 " ;
23 }
24 }
25
26 private bool IsUsernameExist( string strUsername)
27 {
28 bool bRet = false ;
29
30 switch (strUsername.ToUpper())
31 {
32 case " KING " :
33 case " ROSE " :
34 bRet = true ;
35 break ;
36 }
37
38 return bRet;
39 }
40
41 private bool IsValidUsername( string strUsername)
42 {
43 return (Regex.IsMatch(strUsername, @" ^(/w{3,15})$ " ));
44 }
45 }
2 {
3 protected void Page_Load( object sender, EventArgs e)
4 {
5 AjaxPro.Utility.RegisterTypeForAjax( typeof (_Default));
6 tbUsername.Attributes.Add( " OnKeyUp " , " VerifyUserName(this.value) " );
7 }
8
9 [AjaxPro.AjaxMethod]
10 public string GetReturnCode( string strName)
11 {
12 if ( ! IsValidUsername(strName))
13 {
14 return " 1 " ;
15 }
16 else if ( ! IsUsernameExist(strName))
17 {
18 return " 2 " ;
19 }
20 else
21 {
22 return " 0 " ;
23 }
24 }
25
26 private bool IsUsernameExist( string strUsername)
27 {
28 bool bRet = false ;
29
30 switch (strUsername.ToUpper())
31 {
32 case " KING " :
33 case " ROSE " :
34 bRet = true ;
35 break ;
36 }
37
38 return bRet;
39 }
40
41 private bool IsValidUsername( string strUsername)
42 {
43 return (Regex.IsMatch(strUsername, @" ^(/w{3,15})$ " ));
44 }
45 }
(五). 示例代码下载