透過 jquery ajax() 來呼叫 .NET Web Service 的方法

用 jquery 的 ajax() 方法呼叫 .net web service 有二種情況比較需要討論：

1. 如何取得複雜型別的資料
2. 如何回傳帶有參數的方法

這二種狀況是比較多人不知道怎麼設計的，以下將就這二種情況分別說明如何實作：

首先我們先實作 web service 的方法，最簡單的方式就是可以在 Page 頁面上實作
Web Method ，實作上須注意三個重點：

1. Method 一定要是靜態 (static) 方法
2. 請記得在方法上加入 WebMethodAttribute 此 Meta 屬性
3. 無法用多載的方式來命名相同的方法名稱

這三個設計 Web Method 的規則沒有遵守的話，就會發生 Server Error 情況產生。

          接下來將展示要 demo 的程式碼，以下為 .cs 所要實作的部份：

using System;
using System.Web.Services;

public partial class Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }

    [WebMethod]
    public static User GetUser()
    {
        return new User() { FirstName = "小明", LastName = "王", };
    }

    [WebMethod]
    public static string GetFullName(User data)
    {
        return GetFullName2(data.FirstName, data.LastName);
    }

    [WebMethod]
    public static string GetFullName2(string firstName, string lastName)
    {
        string fullName = lastName + firstName;

        if(string.IsNullOrEmpty(fullName))
            return "請在姓、名的文字方塊上輸入想要計算的名稱。";
        else
            return fullName;
    }
}

public class User
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
}

         接下來在 .aspx 上撰寫所要呈現的介面：

User 資料

姓：
名：

          然後一樣在 .aspx 上撰寫 javascript 程式碼，請記得到參考 jquery.js 的檔案：

          jquery.ajax 呼叫 .net web service 的實作：

          說明一下  javascript 程式碼的功能用途：

• getData() 方法是用來展示從 server side 取得複雜型別物件的範例，從 Web Method 取得的過程中，物件已序列化成 json , 而從 ajax 委派 sucess 的事件中，參數 results.d 則已經可以取得傳回的物件, 屬性取得的方式，則為原 User 類別上的屬性名稱。 
• getFullName() 方法則是展示如何傳遞帶有參數的方法回去，這邊的重點在於傳遞回去的物件，其 "屬性名稱" 必須要跟 Web Method 裡的 "參數名稱" 要一樣，否則傳遞回去會發生找不到相對應的參數值的錯誤，過程中，傳遞回去須先序列化成 json ，可透由 javascript 的 JSON.stringify() 方法來達成， 到了 server 端 .net 會自動幫你轉回你參數上的型別。