从控制器操作返回的 Json 获取数据答案

【问题标题】：Getting data from Json returned by controller action从控制器操作返回的 Json 获取数据
【发布时间】：2020-05-27 02:57:18
【问题描述】：

我有一个模态，我试图通过控制器操作的 JSON obj 发送模态来填充它。它似乎可以很好地返回模型，但是我很难从模型中提取数据来填充 HTML。下面是我的代码。

如果有人可以帮助纠正我在 JS 中的语法，将不胜感激。

控制器动作：

      [HttpGet]
    public ActionResult JobPollerParameters(int jobRequestId)
    {
        var model = new Dashboard.Web.Models.Tools.JobPollerMonitorResponseModel();

        try
        {
            using (var client = new DashboardAPIClient())
            {
                var response = client.GetJobRequestParemeters(jobRequestId);
                model.JobRequestParameters = response.JobRequestParameters;


            }
        }
        catch (Exception ex)
        {
            ExceptionHandling.LogException(ex);
            throw;
        }

        return Json( model.JobRequestParameters, JsonRequestBehavior.AllowGet);
    }

需要显示JSON数据的模态：

<div class="modal fade" id="paramsModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-header modal-header-primary">
            <a class="btn btn-xs btn-primary pull-right" data-dismiss="modal" aria-label="Close"><span class="glyphicon glyphicon-remove"></span></a>
            <h4 class="modal-title" id="modalTitleText"></h4>
        </div>
        <div class="modal-body">
            <div class="row">
                <div class="col-md-3 font-weight-bold">Name:</div>
                <div class="col-md-9" id="modalName"></div>
            </div>
            <div class="row">
                <div class="col-md-3 font-weight-bold">Message:</div>
                <div class="col-md-9 text-break" id="modalMessage"></div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
        </div>
    </div>
</div>

JS函数：

    $('#paramModalBtn').click(function () {

    var col = $('#requestId');
    var jobRequestId = col.data("id");

    //console.log(jobRequestId);

     $.ajax({
        url: '@Url.Action("JobPollerParameters", "Tools")',
         data: { "jobRequestId": jobRequestId},
        success: function(results){

            $modal = $('#paramsModal');
            $modal.modal("show");

            var name = JSON.parse(results.name);
            var message = JSON.parse(results.message)

            $('#modalName').text(name);
            $('#modalMessage').text(message);
        }
    });
});

另外，在某些情况下，我想表明我返回的模型应该是“JobRequestParameters”列表，其中我需要 Model.JobRequestParameters.Name 和 JobRequestParameters.value。

如果我在控制台中记录结果，我可以看到我真正需要的东西在那里。

JobParameterId: 118190
JobRequestId: 118190
Name: "CUSTOMERTYPE"
Value: "Notary Pre-Assessment"

名称和价值是我需要的。

【问题讨论】：

您能发布操作返回的实际 JSON 吗？在你运行 JSON.parse 之前。

标签： json asp.net-mvc razor asp.net-ajax

【解决方案1】：

控制器返回格式为 JSON 的字符串，然后可以将其解析为 JavaScript 对象并按原样使用。

您需要解析一次数据，然后您将拥有一个可以使用的对象。

var obj = JSON.parse(results);
$('#modalName').text(obj.name);
$('#modalMessage').text(obj.message);

【讨论】：

这不起作用，我认为这与我返回模型的一部分有关。
您能否编辑您的问题以包含响应中返回的实际 JSON？

【解决方案2】：

这里是反序列化JSON对象的解决方案

    $("button").click(function () {

    var col = $('#requestId');
    var jobRequestId = col.data("id");

     $.ajax({
        url: '@Url.Action("JobPollerParameters", "Tools")',
         data: { "jobRequestId": jobRequestId},
        success: function(results){

            $modal = $('#paramsModal');
            $modal.modal("show");
            console.log(results);

            var name = JSON.stringify(results[0].Name);
            var value = JSON.stringify(results[0].Value);

            $('#modalName').text(name);
            $('#modalMessage').text(value);
        }
    });
});

【讨论】：