使用 jquery 获取 JSON 对象，从控制器调用 ajax 以查看

Question

我已经尝试了几个小时来找出如何取回 JSON 对象的解决方案：

这是我的功能以及我尝试过的所有功能：

$(document).ready(function () {
    $(".nav-link").click(function () {
        var chairChosen = $(this).attr("data-id");
        var perfDateId = $("#perfDate").attr("id");
        var totalCost = $("#totalMoney").html();
        window.alert(perfDateId);
        $.ajax({
            url: '/Booking/ReserveSeat1/?id=' + chairChosen + '&perfDateId=' + perfDateId,
            type: 'GET',
            dataType: 'json',
            success: function (data1) {

                $("#test").append(typeof data1);
                $("#test").append(" notConverted" + data1.Number);
                $("#test").append(" notConverted" + data1["Number"]);
                var result1 = jQuery.parseJSON(data1);
                $("#test").append("Converted jquery" + result1.Number);
                $("#test").append("Converted jquery" + result1["Number"]);
                var result2 = JSON.stringify(data1);
                var object1 = data1;
                $("#test").append("get object " + object1.Number)
                $("#test").append("Converted parse" + result2.Number);
                $("#test").append("Converted parse" + result2["Number"]);
            },
            error: function (error) {
                $(that).remove();
                DisplayError(error.statusText);
            }
        });

    });

});

我想提数据我不想发送JSON数据，我只希望收到。

以下代码在我的控制器中：

[HttpGet]
    public ActionResult ReserveSeat1(int id, int perfDateId)
    {

        BookSeatResult bookSeat = new BookSeatResult()
        {
            Number = 10,
            Result = "a string"
        };

        return Json(bookSeat);
    }

还尝试了 return来自控制器的 JSON 响应。

它是 asp.net 核心中的一个 mvc 网络应用程序。

别忘了提一下，当我调用时，控制器会响应，并且它会 return 一个对象类型

Answer 1

从方法中删除 HttpGet 属性或将其更改为 HttpPost，然后执行 AJAX POST:

$.ajax({
  url: '/Booking/ReserveSeat1/?id=' + chairChosen + '&perfDateId=' + perfDateId,
  type: 'POST',
  dataType: 'json',
  success: function (data1) {

  }

//...

Answer 2

感谢您的参与，在花了一些时间听取您的建议后，我设法找到了解决方法：

newObj.Add(bookSeat.Number.ToString());
        newObj.Add(bookSeat.Result);

        return Json(newObj.ToArray());

我现在返回一个数组，我在视图中访问它如下：

  $("#test").append(data1[1]);

另外，我分析了接收回来的数据，所以我做了以下事情：

$("#test").append(data1["result"]);

现在我得到了预期的字符串

Answer 3

对于Json对象，是区分大小写的，也就是说data1.Number和data1.number是不同的。

对于Asp.Net核心序列化，它的默认序列化器是camelCase，这意味着，return Json(bookSeat);将return一个json字符串，如下所示：

{"number":10,"result":"a string"}

对于这个字符串，如果你需要访问number和result，你需要使用number而不是Number。

尝试

$("#test").append(data1.number);
$("#test").append(data1.result);

如果要使用data1.Number，需要将asp.net核心更改为returnPascalCase，配置如下Startup.cs[=24] =]

services.AddMvc()
.AddJsonOptions(options => options.SerializerSettings.ContractResolver = new DefaultContractResolver())
.SetCompatibilityVersion(CompatibilityVersion.Version_2_2);

Answer 4

$(document).ready(function () {
   $(".nav-link").click(function () {
    var chairChosen = $(this).attr("data-id");
    var perfDateId = $("#perfDate").attr("id");
    var totalCost = $("#totalMoney").html();
    window.alert(perfDateId);
    $.ajax({
        url: '/Booking/ReserveSeat1/?id=' + 
   chairChosen + '&perfDateId=' + perfDateId,
        type: 'GET',
        dataType: 'json',
        success: function (data1) {

            $("#test").append(typeof data1);
            $("#test").append(" notConverted" + 
   data1[0]["Number"]);
            $("#test").append(" notConverted" + 
  data1[0]["Number"]);
            var result1 = jQuery.parseJSON(data1);
            $("#test").append("Converted jquery" + 
 result1[0]["Number"];
            $("#test").append("Converted jquery" + 
result1[0]["Number"]);
            var result2 = JSON.stringify(data1);
            var object1 = data1;
            $("#test").append("get object " + 
object1[0]["Number"])
            $("#test").append("Converted parse" + 
 result2[0].["Number"]);
            $("#test").append("Converted parse" + 
 result2[0]["Number"]);
        },
        error: function (error) {
            $(that).remove();
            DisplayError(error.statusText);
        }
    });

});

data1[0]["Number"],result1[0]["Number"]中的0为Key。指示数组中的行索引。我还添加了 booSeat 并作为 JSON 序列化数组返回，如下所示。

[HttpGet]
   public ActionResult ReserveSeat1(int id, int 
 perfDateId)
{

    BookSeatResult bookSeat = new BookSeatResult()
    {
        Number = 10,
        Result = "a string"
    };
 List<BookSeatResult> bookSeatList = new 
 List<BookSeatResult>();
    bookSeatList.Add(bookSeat);
    return 
    Json(JsonConvert.SerializeObject(bookSeatList
    .ToArray()));
}

在 ajax 函数中检索 json 数据中的项目的模式是：

  $.ajax({
       ....
    success: function (data1) {
     var item1 = data1[0]["Attribute1"];
    }

使用 jquery 获取 JSON 对象，从控制器调用 ajax 以查看

get JSON object using jquery with ajax call from controller to view

.net

asp.net

jquery

asp.net-ajax

asp.net-core