Question

目前我有一个名为False的主视图。在这个视图中，我有三个按钮，每个按钮一年。当我点击一个按钮（或页面加载）时，我会调用一个方法，这个方法需要一年的时间。参数并使用year参数调用ajax。这个ajax调用一个action方法（getRolesByYear，主视图的方法）。 Action方法对数据库进行查询，数据库的结果是pandas.rolling_mean(df[~df.flag], window=30)个对象的列表。在return语句中，我返回一个像这样的PartialView：getRolesByYear.cshtml。遗憾的是，在所有这一切之后，我得到的只是ajax调用的错误部分的错误，而不是在我的前端获得所需对象的列表。我一般都是新手，我对此很不满意。

以下是主视图ViewModel：

return PartialView("_yearlyRoles",list);

部分视图：

getRolesByYear.cshtml

行动方法：

    @{
    ViewBag.Title = "getRolesByYear";
}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">


    getRolesForYear(parseInt(@DateTime.Now.Year));

    $(function () {
        $('#years a').click(function () {
            var year = $(this).text();
            console.log(year);
            getRolesForYear(parseInt(year));
        });
    })
    //console.log(year);


    function getRolesForYear(year) {
        console.log(year);
        $.ajax({
            type: "POST",
            url: '@Url.Action("getRolesByYear", "WorkRoles")',
            dataType: "json",
            data: {
                year: year
            },
            success: successFunc,
            error: errorFunc
        });

        function successFunc(data, status) {



                $("#partial").html(data);


        }

        function errorFunc() {
            alert('error');
        }
    }



</script>

<div id = "years" class="btn-group btn-group-justified timeline">
    <a  href="#@DateTime.Now.Year" class="btn btn-primary">@DateTime.Now.Year</a>
    <a  href="#@DateTime.Now.AddYears(-1).Year" class="btn btn-primary">@DateTime.Now.AddYears(-1).Year</a>
    <a  href="#@DateTime.Now.AddYears(-2).Year" class="btn btn-primary">@DateTime.Now.AddYears(-2).Year</a>
</div>

<div id = "partial"></div>

Answer 1

鉴于报告的错误消息，您需要更改您的ajax调用。通过设置＆＃34;数据＆＃34;参数到＆＃34; json＆＃34;你告诉ajax期望在响应中返回JSON格式的数据，但部分视图是HTML，所以更改你的ajax调用以反映这一点：

$.ajax({
    type: "POST",
    url: '@Url.Action("getRolesByYear", "WorkRoles")/' + year,
    dataType: "html", //set the correct data type for the response
    success: successFunc,
    error: errorFunc
});

顺便说一句，通过使用$ .ajax提供给回调的参数，将errorFunc更改为类似的内容，可以非常简单地改善客户端的错误处理：

function errorFunc(jQXHR, textStatus, errorThrown) {
    alert("An error occurred while trying to contact the server: " + jQXHR.status + " " + textStatus + " " + errorThrown);
}

对于不那么突兀的报告和/或更简单的调试，您可以将alert更改为console.log。要获得更多细节，您还可以记录整个jQXHR对象：

console.log(JSON.stringify(jQXHR));

使用ajax渲染局部视图

1 个答案: