asp.net - 如何在 asp.net 核心中使用 AJAX 从操作方法中获取数据？

Question

我正在尝试从操作方法中获取所有票证并将它们作为 json 返回以在视图中显示它们。我写了下面的代码，但是当我运行它时，它只显示没有表格的 json。我想获取数据并将它们显示在表格中。这是我得到的输出： 这是动作：

 public IActionResult MyTickets(string filter = "", string orderByType = "")
    {
        System.Threading.Thread.Sleep(2000);
        var userId = User.FindFirst(ClaimTypes.NameIdentifier).Value;
        var myTickets = _ticketService.GetMyTickets(userId,filter,orderByType);  

        if(myTickets.Status == CallBackStatus.Success)
        {                
            var x = JsonSerializer.Serialize(myTickets.Model, new JsonSerializerOptions()
            {
                WriteIndented = true,
                ReferenceHandler = ReferenceHandler.Preserve
            });
            return Json(x);
        }
        else
        {
            return null;
        } 
    }

这是视图：

 <table class="table table-bordered">
                <thead>
                    <tr>
                        <th>وضعیت</th>
                        <th>اولویت</th>
                        <th>کدپیگیری</th>
                        <th>تاریخ ایجاد</th>
                        <th>شخصی؟</th>
                        <th>مخاطب</th>
                        <th>نمایش پاسخ</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody class="BodyData" id="BodyData">
                </tbody>
            </table>
         <div id="DivLoading">
            <img src="~/images/loading.gif" />
        </div>

这是阿贾克斯：

$(document).ready(function () {
            loadData();
        });
        function loadData() {
            $.ajax({
                url: "/Ticket/MyTickets",
                type: "Get",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (ListData, StatusText, jqXHR) {
                    alert("test");
                    console.log(ListData);
                    if (ListData.Error) {
                        DivError.innerHTML = ListData.Error;
                    }
                    var str = "";
                    for (var i in ListData) {                           
                        str += "<td>" + ListData[i].Status + "</td>";
                        str += "<td>" + ListData[i].priority + "</td>";
                        str += "<td>" + ListData[i].TrackingCode + "</td>";
                        str += "<td>" + ListData[i].CreateDate + "</td>";
                        str += "<td><a onclick=Edit(this) data-toggle='modal' data- 
                       target='#myModal'>ویرایش</a></td>";
                        str += "<td><a onclick=Remove(" + ListData[i].CommidityID + ")>حذف</a> 
                       </td>";
                        str += "</tr>";
                    }
                    BodyData.innerHTML = str;
                    $(".TblData tr").fadeIn(1000);

                },
                beforeSend: function (jqXHR, Setting) {
                    $("#DivLoading img").css({ "display": "none" });
                },
                error: function (jqxhr, status, errorMsg) {
                    alert(errorMsg);
                },
                complete: function (jqXHR, Status) {

                    $("#DivLoading").css({ "display": "none" });
                }
            });
        }

Answer 1

我认为您的 json 返回没有任何问题。

但是您忘记在 ajax 响应中打开 tr 了。

像

for (var i in ListData) {   
     str += "<tr>"; --> You missed this so you don't open tr tag
     -- data from json --
     str += "</tr>";
}