在页面加载时显示从控制器返回的 json 数据到 cshtml 页面答案

【问题标题】：display the json data returned from controller to cshtml page on page load在页面加载时显示从控制器返回的 json 数据到 cshtml 页面
【发布时间】：2021-12-25 22:01:50
【问题描述】：

我有一个返回 json 数据的控制器方法，

public JsonResult GetByKey(int? id)
        {           
                if (id == null)
                {
                    return Json(new { success = false, responseText = "Error! Please contact Administrator..." }, JsonRequestBehavior.AllowGet);
                }
                var data = (from z in db.FirmModels
                            where z.FirmId == id
                            select z).ToList();

                return Json(data, JsonRequestBehavior.AllowGet);            
        }

它将只返回单行。我必须在视图页面中显示这些数据，但我不知道该怎么做？

cshtml页面：

@{
    ViewBag.Title = "Customer Details";
}

<div class="d-flex p-2">
    <div style="float:left;">
        <input type="text" id="i_nimitta" class="myDivClass" />
        <input type="checkbox" id="c_nimitta" />
    </div>
</div>
<br />
<div >
    <div id="lbl_firmName" style="display:inline;"></div>
    <div id="lbl_ownerName" style="display:inline;"></div>
</div>
<script src="~/Scripts/jquery-3.4.1.slim.min.js"></script>
<script>
    $(document).ready(function () {
        $.getJSON("FirmModels/GetByKey",
            function (json) {
                for (var i = 0; i < json.length; i++) {
                    $('#lbl_firmName').html(json[i].firmName);
                    $('#lbl_ownerName').html(json[i].ownerName);
                }
            });
    });
  
</script>

在许多解决方案中，我发现 json 在表格中以表格形式显示，但我需要按段落显示数据。喜欢：

<div id="d_firmContent">
This firm <div id="lbl_firmName" style="display:inline;"></div> belongs to Mr./Mrs. <div id="lbl_ownerName" style="display:inline;"></div>
//similarly other set of data from json
</div>

那么，我该怎么做呢？ 我只获取原始 json 数据，查看页面不显示为什么？

Json 输出

[{"FirmId":2,"FirmName":"Jeenat Travels","PropName":"Jeenat Harpa","PropAddress":"HP","PropContact":"5345345345345","PropCitizenshipNum":"5345345345","Email":"","CapitalAmount":"10000",}]

我在function (json) 中保持警惕，但它也不起作用，似乎页面没有重定向到 cshtml 页面，控制器只输出原始 json 文件。但我不确定，有什么问题。本地主机 url https://localhost:44334/FirmModels/GetByKey/2

【问题讨论】：

我不知道你的 db.FirmModels 怎么样，但我猜你是按 ID 过滤的，所以只有一个结果出来？
@Dementic 是的，我在帖子中只提到了单行，但是现在如何在视图页面中显示该 json 数据。
你不断覆盖结果 $('#lbl_firmName').html(json[i].firmName);将继续将 Next 结果写入同一个 div。相反，您应该创建新行。
@Dementic 我必须以段落格式显示 json 数据，而不是表格形式。但是我该怎么做呢？我正在获取原始 json 数据作为输出。请帮忙！！！
可以分享一下json输出吗？

标签： javascript json asp.net-mvc asp.net-mvc-4

【解决方案1】：

属性应该是帕斯卡大小写：FirmName 而不是firmName，根据 OwnerName，它似乎没有包含在 json 中，因此不会设置。请注意我已内联 Json，但它也适用于您的示例，主要问题是属性名称的大小写。

var json = [{
  "FirmId": 2,
  "FirmName": "Jeenat Travels",
  "PropName": "Jeenat Harpa",
  "PropAddress": "HP",
  "PropContact": "5345345345345",
  "PropCitizenshipNum": "5345345345",
  "Email": "",
  "CapitalAmount": "10000",
}];

$(document).ready(function() {
    $('#lbl_firmName').html(json[0].FirmName);
    $('#lbl_ownerName').html(json[0].OwnerName);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<div id="d_firmContent">
  This firm
  <div id="lbl_firmName" style="display:inline;"></div> belongs to Mr./Mrs.
  <div id="lbl_ownerName" style="display:inline;"></div>
</div>

【讨论】：