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

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

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

(一). 运行效果如下:

(二). 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>

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

就可以在客户端直接使用服务端方法, 非常方便, 客户端调用后台代码如下:

var returnValue = 后台代码类名.GetSearchItems(参数);

(四). 详细代码如下

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         输入用户名: 
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 }

(五). 示例代码下载

https://files.cnblogs.com/ChengKing/AjaxPro.NET_DataValidate.rar