使用Jquery的Ajax調用后台方法具體有三種方式:
1.在后台定義一般處理程序ashx,響應前端的請求。
2.在頁面的aspx.cs中定義靜態方法+WebMethod,響應前端的請求。
3.通過WCF進行處理。
第三種調用方式不在本筆記的討論范圍中。以下針對第一、二種方式進行深入討論。
1.使用一般處理程序響應前端請求
A. 在Web項目中新建一般處理程序(后端):
B. 在ProcessRequest添加響應前端請求的代碼(后端)。例如下面范例:
public override void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
var action = GetQueryString("action");
var strResult = "";
switch (action)
{
case "action1": //前端請求的操作1
function1()
break;
case "action2": //前端請求的操作2
function2()
break;
case "action3": //前端請求的操作3
function3()
break;
...
}
context.Response.Write(strResult);
context.Response.Flush();
}
private void function1(){...} //處理前端請求的函數1
private void function2(){...} //處理前端請求的函數2
private void function3(){...} //處理前端請求的函數3
C. 在一般處理程序使用session(后端)
在一般處理程序中使用session必須要繼承IRequiresSessionState接口並引用System.Web.SessionState命名空間。
D. JavaScript請求后端代碼(前端)
在JavaScript中加入下面范例便可以發送請求到一般處理程序:
var url = "HandleType.ashx?action=Edit"; //請求鏈接格式:一般處理程序文件?action="請求的操作"
url += "&參數名1=" + $("#hdfId").val(); //參數格式&參數名=值
url += "&參數名2=" + $("#hdfParentId").val(); //參數格式&參數名=值
url += "&參數名3=" + encodeURI(encodeURI($("#txtName").val())); //參數格式&參數名=值
$.ajax({
type: "post", //以POST的方式發送請求
url: url, //上面拼湊的鏈接及參數
contentType: "application/json",
dataType: "json",
success: function (data)
{
//成功獲取一般處理程序響應后執行的代碼
},
error: function (err)
{
//收到一般處理程序響應失敗后執行的代碼
}
});
2. 在頁面的aspx.cs中定義靜態方法+WebMethod,響應前端的請求
A. 在aspx文件中添加以WebMethod為前綴標識的靜態方法 (后端)
參數名與參數個數一定要與前端
B. JavaScript請求后端代碼(前端)
在JavaScript中加入下面范例便可以發送請求到一般處理程序:
$.ajax({
type: "post",
url: "TestMatrix1.aspx/SayHello", //請求鏈接格式:頁面文件/請求的操作(頁面的帶有WebMethod前綴的靜態函數)
data: JSON.stringify //傳遞的參數使用JSON.stringify轉譯為JSON格式
({
"in_Id": $("#hdfId").val(), //傳遞給后台的參數格式:"參數名":值。參數名與參數個數一定要與后台函數的參數名及參數個數完全一致
}),
contentType: "application/json",
dataType: "json",
success: function (data)
{
//
},
error: function (err)
{
}
});
參數以JSON的形式傳遞到后台函數,系統會根據調用的函數參數類型做一次強制類型轉換。但建議后台的函數參數類型為string,在函數中寫代碼進行轉換。這樣可以先判斷傳入的參數內容再進行對應參數類型的轉換。減少錯誤類型轉換的問題。