问题返回' PartialView'在JSON内部响应

时间:2018-01-10 11:34:50

标签: jquery json ajax partial-views

我有一部分是在Ajax调用后重新加载的。以下代码有效:

public PartialViewResult AddPreferredPosition(string playerID, int positionID)
    {
            playerService.AddPlayerPreferredPosition(Guid.Parse(playerID), positionID);

            PreferredPositionsModel model = new PreferredPositionsModel();
            model.PreferredPositions = playerService.GetPlayerPreferredPositions(Guid.Parse(playerID));
            model.Positions = playerService.GetPositions();
        return PartialView("~/Areas/Admin/Views/Player/Partials/PreferredPositions.cshtml", model);
    }

以及:

var params = {};
    params.playerID = $('#PlayerID').val();
    params.positionID = $("select[name='ddlPositionID'] option:selected").val();
    $.ajax({
        type: 'POST',
        url: '/Admin/Player/AddPreferredPosition',
        data: params,
        success: function (data) {
                $('#PreferredPositions').html(data);
        }
    });

我想略微改变它以进一步管理我的错误处理:

public ActionResult AddPreferredPosition(string playerID, int positionID)
    {
        try
        {
            playerService.AddPlayerPreferredPosition(Guid.Parse(playerID), positionID);

            PreferredPositionsModel model = new PreferredPositionsModel();
            model.PreferredPositions = playerService.GetPlayerPreferredPositions(Guid.Parse(playerID));
            model.Positions = playerService.GetPositions();

            return Json(new
            {
                Success = true,
                HTML = PartialView("~/Areas/Admin/Views/Player/Partials/PreferredPositions.cshtml", model)
            }, JsonRequestBehavior.AllowGet);
        }
        catch (Exception ex)
        {
            return Json(new
            {
                Success = false,
                ErrorMessage = ex.Message,
                InnerException = (ex.InnerException != null ? ex.InnerException.Message : ""),
                ex.StackTrace
            });
        }
    }

使用:

$.ajax({
        type: 'POST',
        url: '/Admin/Player/AddPreferredPosition',
        data: params,
        success: function (data) {
            if (data.Success) {
                $('#PreferredPositions').html(data.HTML);
            } else {
                alert(data.ErrorMessage);
                console.log(data.StackTrace);
            }
        }
    });

但是,当我这样做时,data.HTML不是编译的部分视图的HTML,就像在工作示例中一样。

我做错了什么?

2 个答案:

答案 0 :(得分:2)

在本节中更正您的准则。

$.ajax({
    type: 'POST',
    url: '/Admin/Player/AddPreferredPosition',
    data: params,
    success: function (data) {
        if (data.Success) {
            $('#PreferredPositions').html(data.HTML);
        } else {
            alert(data.ErrorMessage);
            console.log(data.StackTrace);
        }
    }
});

当您返回JSON时,您将不得不从Json解析该数据。 否则,您将无法通过

直接访问该数据
data.HTML

希望这有帮助。

答案 1 :(得分:0)

在原始代码中,返回PartialView,然后由Razor呈现为HTML。在修改后的版本中,您返回相同的内容但在对象内部,因此它保持不变。

实际上渲染会发生,但它是JSON渲染,它不会“自动”导致它包含的PartialView对象的HTML渲染。有关可能的解决方案,请参阅 this question this question