如何在 jQuery 中调用 C# 方法？

Question

我正在使用一个图表，它应该从 C# 获取输入来绘制图表。我正在使用 JSON 将值从 C# 返回到 jQuery。无论如何它对我没有帮助，我做错了什么？

这是我的 aspx 代码：

<script type="text/javascript">
    $(document).ready(function () {
        var source = {};

        $.ajax({
            type: 'POST',
            dataType: 'json',
            url: "Default.aspx/getall",
            contentType: 'application/json; charset=utf-8',
            cache: false,
            success: function (response) {

                source = $.parseJSON(response.d);

            },
            error: function (err) {
                alert('Error');
            }
        });
</script>

这是我的 C# 代码：

public class sampledata
{
    public string Day { get; set; }
    public int Keith { get; set; }
    public int Erica { get; set; }
    public int George { get; set; }
}

public partial class _Default : System.Web.UI.Page 
{
    List<sampledata> s = new List<sampledata>();

    protected void Page_Load(object sender, EventArgs e)
    {
        s.Add(new sampledata { Day = "monday", Keith = 20, Erica = 15, George = 25 });
        s.Add(new sampledata { Day = "tuesday", Keith = 25, Erica = 20, George = 35 });

        Session["data"] = s;                  
    }

    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public static List<sampledata> getall()
    {
        List<sampledata> data = (List<sampledata>)HttpContext.Current.Session["data"];
        return data;
    }
}

Answer 1

我测试了你的代码，一切似乎都很好，除了我将 List 序列化为字符串并返回。

$(window).load(function () {
    $.ajax({
        type: "POST",
        url: "PageMethodTest.aspx/getall",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: fnsuccesscallback,
        error: fnerrorcallback
    });
});

function btnclick() {}

function fnsuccesscallback(data) {
    alert(data.d);

}

function fnerrorcallback(result) {
    alert(result.statusText);
}

服务器端代码：

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static String getall()
{
    List<sampledata> data = (List<sampledata>)HttpContext.Current.Session["data"];
    JavaScriptSerializer js = new JavaScriptSerializer();

    return js.Serialize(data);
    //return data;
}

结果是：

您可以改进将输出用作图表的来源。

Answer 2

您可以使用 PageMethods 代替 ajax 回发：

在 C# 页面中：

[WebMethod]
public static List<sampledata> getall()
{
    List<sampledata> data = (List<sampledata>)HttpContext.Current.Session["data"];
    return data;
}

在aspx页面中：

$(document).ready(function () {
    var data=PageMethods.getall(OnSuccess);

    function OnSuccess() {
        alert("Success");
    }
});

对于使用 PageMethods，您还需要在表单标签中添加它：

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />

Answer 3

如果您不想依赖 Microsoft 的 AJAX 实现（WebMethodAttribute、ScriptManager，不必担心响应的 .d 属性等），您可以使用干净的 JSON 调用ASHX 处理程序。您必须自己做一些工作，但是通过做更传统的 AJAX，您可以摆脱 WebForms 的束缚。

对于您的示例，C# 部分如下（注意 IRequiresSessionState 实现，它使您的会话可用）：

// something.ashx.cs
public class something : IHttpHandler, IRequiresSessionState {
    public void ProcessRequest(HttpContext context) {
        context.Response.ContentType = "application/json";
        context.Response.Write(JsonConvert.SerializeObject(context.Session["data"]));
    }

    public bool IsReusable { get { return false; } }
}

您的 javascript 调用只是对这个 something.ashx 文件的调用：

jQuery.ajax({
    url: "something.ashx",
    type: "post",
    dataType: "json"
}).done(function(result) {
    console.log(result);
});

您没有任何 POST 参数，但如果有，您只需将它们包含在您的调用中，并直接从处理程序中的 Request 读取它们：

jQuery.ajax({
    ...
    data: { requestMessage: "Hello!" }
});


public void ProcessRequest(HttpContext context) {
    string requestMessage = context.Request["requestMessage"]; // Hello!
    ...etc...
}