从 JavaScript 调用 C# 方法并返回 JSON

Question

我正在尝试使 JavaScript 与 C# 一起工作。现在，我只是想从 C# 中检索（GET）一个返回结果并通过 JavaScript 显示它。稍后，它将用于数据库写入（POST）。就像这样，读完之后，这就是我卡住的地方：

我有按钮：

<button id="btn" onclick="Create();">CREATE</button>

然后是JS代码：

function Create() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
        alert(xhttp.response)
    }
  };
xhttp.open("GET", "default.aspx/Create", true);
xhttp.send();
}

然后是 C# WebMethod：

[WebMethod]
public static string Create()
{
    return "WebMethod";
}

那么，如何在“onreadystatechange”上获得“WebMethod”值？并使所有数据变为 JSON？不需要为我编写代码，只需将我指向正确的方向，因为我在这个概念上失败了，因为我在正确的方式上阅读了许多相互矛盾的意见。没有 jQuery。

Answer 1

要从 java 脚本调用 C# 方法，您必须使用 ajax。以下是如何从 java script 或 jquery 调用 c# 方法的示例。

http://www.c-sharpcorner.com/UploadFile/8911c4/how-to-call-C-Sharp-methodfunction-using-jquery-ajax/

Answer 2

这可以给你一个结合 jQuery 的起点：

/ * test.html * /

<script>
    function Create() {
        // create some data object here
        var data = {
            value1: 'string 1',
            value2: 'string 2',
            value3: 'string 3'
        };

        // post data to c# web service (web method)
        $.ajax({
            url: 'default.aspx/processData', // the path to the *.aspx-file has to correct here!
            type: 'POST',
            dataType: 'json',
            contentType: 'application/json; charset=utf-8',
            data: JSON.stringify({ formData: data }),
            async: true,
            success: function (msg, status) {
                console.log(msg.d);
            },
            failure: function (data) {
                console.log(msg.d);
            },
            error: function (jqXHR, textStatus, errorThrown) {
                console.log(textStatus + " : " + errorThrown);
            }
        });
        return false;
    }
</script>
<button onclick="Create();">Create</button>

/ * default.aspx * /

<%@ Page Language="C#" Src="default.aspx.cs" Inherits="main" %>

/ * default.aspx.cs * /

using System;
using System.Web.Services;
using System.Web.UI;

public class main : Page {
    protected void Page_Load(object sender, EventArgs e) { }

    [WebMethod]
    public static string processData(FormData formData) {
        //access your data object here e.g.:
        string val1 = formData.value1;
        string val2 = formData.value2;
        string val3 = formData.value3;

        return val1;
    }

    // the FormData Class here has to have the same properties as your JavaScript Object!
    public class FormData {
        public FormData() { }

        public string value1 { get; set; }
        public string value2 { get; set; }
        public string value3 { get; set; }
    }
}