ASP.NET页面使用AjaxPro2完成JS调用后台方法

ASP.NET页面使用AjaxPro2完成JS调用后台方法

一、首先下载AjaxPro.2.dll（附下载地址）

百度网盘链接：https://pan.baidu.com/s/1r87DE1Tza9F4NbJwTCS1AQ
提取码：10p6

二、在Visual studio中创建空Web项目，并引用AjaxPro.2.dll

三、打开Web.config文件，加入以下节点：

<configuration>

<system.web>

<httpHandlers>

<add verb="*" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2" validate="false"/>

</httpHandlers>

</system.web>

<system.webServer>

<handlers>

<add name="AjaxPro_AjaxHandlerFactory" preCondition="integratedMode" verb="*"

path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2" />

</handlers>

</system.webServer>

</configuration>

四、使用步骤

1. 新建一个名为Test的web页面，在顶部using AjaxPro；

2. 在Page_Load中输入以下代码(写在Page.IsPostBack外面)：

   Utility.RegisterTypeForAjax(typeof(Test));

3. 在类名上增加[AjaxNamespace("TestAjax")]，此处"TestAjax"用于在js中调用时使用，可自己定义名称；
4. js需要调用的方法上增加[AjaxMethod]
5. js中调用方式： var tes = TestAjax.TestA().value;

五、在项目中的使用实例

后台代码

 [AjaxNamespace("VehicleAjax")]

 public partial class WebUserControl_wUCtlVehicle : System.Web.UI.UserControl

 {

     protected void Page_Load(object sender, EventArgs e)

     {

         Utility.RegisterTypeForAjax(typeof(WebUserControl_wUCtlVehicle));

         if (!Page.IsPostBack)

         {

          }

     }  

  [AjaxMethod]

     public string GetVehicleID(string strVehicle)

     {

         if (strVehicle=="")
             return "";

         else

             return "";

 }

 }

前端代码

 <%@ Control Language="C#" AutoEventWireup="true" CodeFile="wUCtlVehicle.ascx.cs"

     Inherits="WebUserControl_wUCtlVehicle" %>

 <script type="text/javascript">

     function chkAddVehicleInfo() {

 　　　　　　var res = VehicleAjax.GetVehicleID(txtVehicleID.value.replace(/\s+/g, ''));

         if (res.value == "1") { alert("此编号已存在"); return false; }

     }

 </script>

 <table>

     <tr>

         <td>输入编号：</td>

         <td>

         <asp:TextBox ID="txtVehicleID" runat="server"></asp:TextBox>

         </td>

         <td>

             <asp:Button ID="btnSave" runat="server" Text="保存"  OnClientClick="chkAddVehicleInfo();"/>

         </td>

     </tr>

 </table>