Ajax/Json MVC 表填充不起作用

Posted 2023-05-08

【中文标题】Ajax/Json MVC 表填充不起作用

【英文标题】：Ajax/Json MVC table population not working

【发布时间】：2019-11-22 18:19:02

【问题描述】：

我正在尝试提取附加到特定用户 ID 的前 10 个最近提交的表单。

AJAX 未正确触发和填充我的表。在调试时，它会捕获我的按钮单击事件，并将其转发给 ajax，但它会停在那里。该表保持空白且未填充。

我的按钮点击事件/ajax调用如下：

$(document).ready(function () 

$("#btnLoadRA").click(function () 
    LoadData();
);  

function LoadData() 
    $("#raresults tbody tr").remove();
    $.ajax(
        type:'GET',
        url: '@Url.Action("getRoofAccessForms", "Home")',
        dataType: 'json',
        data:  id: '' ,
        success: function (data) 
            var items = '';
            $.each(data, function (i, item) 
                var rows = "test;";
                $('#raresults tbody').append(rows);
            );
            alert('success');
        ,
        error: function (ex) 
            var r = jQuery.parseJSON(response.responseText);
            alert("Message: " + r.Message);
            alert("StackTrace: " + r.StackTrace);
            alert("ExceptionType: " + r.ExceptionType);
        
    );

);

我的 JsonResult 方法：

   `public JsonResult getRoofAccessForms(string id)
    
        List<RoofAccessGeneral> raForms = new List<RoofAccessGeneral>();

        int lastFormID = _context.RoofAccessGenerals.Count();

        var userid = User.Identity.GetUserId();

        raForms = _context.RoofAccessGenerals.Where(raGeneral => raGeneral.RoofAccessFormID > lastFormID - 10 && raGeneral.UserID == userid)
            .OrderByDescending(raGeneral => raGeneral.RoofAccessFormID)
            .ToList();

        return Json(raForms, JsonRequestBehavior.AllowGet);

    

` 我的观点（只是桌子）：

<div class="m-portlet__body">
            <div class="tab-content">
                <div class="tab-pane active" id="m_widget4_tab1_content">
                    <table id="raresults">
                        <tbody>
                            @* Stuff will be populated here from ajax.*@
                        </tbody>
                    </table>
                </div>
            </div>
        </div> 

我想将每条记录输出到表中的一行。我知道如何在 ajax 循环中自定义它，但是当我几乎可以肯定我的 Json GET 方法正在按照我的意图从上下文中提取时，我不知道为什么我的测试数据甚至没有被填充（它正在抓取调试时的所有数据）。非常欢迎和赞赏任何建议。

【问题讨论】：

在您的控制台中是否显示任何异常？

【参考方案1】：

function LoadData() 
    $("#raresults tbody tr").remove();
    $.ajax(
        type:'GET',
        url: '@Url.Action("getRoofAccessForms", "Home")',
        dataType: 'json',
        data:  id: '' ,
        success: function (data) 
            var items = '';
            $.each(data, function (i, item) 
                    var rows = "test";
                    $('#raresults tbody').append("<tr><td>" + rows +"</td></tr>");
                );
            alert('success');
        ,
        error: function (ex) 
            var r = jQuery.parseJSON(response.responseText);
            alert("Message: " + r.Message);
            alert("StackTrace: " + r.StackTrace);
            alert("ExceptionType: " + r.ExceptionType);
        
    );

你必须添加 'tr td' 元素，成功后它会起作用，你可以编写每个项目。