這次以項目清單作範例
原理
在專案內新增一個.ashx的檔案,並且將它CodeBehid連結到後端的.cs,透過前端的ajax呼叫這支.ashx,它會連結到後端的那支.cs,以此連結。
PS:.ashx就是沒有前端UI功能的頁面,但是可以操作.cs後端的code。
前端:
用ajax將後端取到的資料,用JQ直接append到畫面上,達到畫面不會reflash。
$.ajax({
url: Test.ashx,
type: "post",
data: {
method: "getcodeitem"
},
success: function (e) {
var jsonObj = $.parseJSON(e);
var $Item = $("#List");
$Item.empty();
$(jsonObj).each(function (index, item) {
$Item.append("<option value='" + item.VALUE + "'>" + item.NAME + "</option>");
});
},
error: function (e) {
alert(e);
}
});
後端:
Test.ashx先將編輯器自動幫你生產的code給刪掉,只留上面那段code,並在CodeBehind連結到後端的.cs。
<%@ WebHandler Language="C#" Class="GetCodeList" CodeBehind="~/App_Code/GetCodeList.cs" %>
GetCodeList.cs這邊先繼承IHttpHandler
,並實作IsReusable
和ProcessRequest
這兩支method,之後就是去DB撈資料的語法。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.SqlClient;
using System.Configuration;
using System.Data;
using Newtonsoft.Json;
public class GetCodeList : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
string aMethod = context.Request.QueryString["method"].ToString();
if(aMethod == "getcodeitem") {
DataTable aDataTable = new DataTable();
using (SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["DB"].ToString()))
{
conn.Open();
SqlCommand cmd = new SqlCommand(@SQL語法, conn);
using (SqlDataReader dr = cmd.ExecuteReader())
{
try
{
aDataTable.Load(dr);
}
finally
{
conn.Close();
conn.Dispose();
dr.Close();
}
}
}
context.Response.Write(JsonConvert.SerializeObject(aDataTable));
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
這種寫法稱為泛型處理常式
,是用來處理HTTP Request
的一種方式,可以把ashx想像成沒有畫面的aspx。