在变量中有一个 Json 数据,并希望在 asp.net 中以表格形式显示该数据

Posted

技术标签:

【中文标题】在变量中有一个 Json 数据,并希望在 asp.net 中以表格形式显示该数据【英文标题】:Have a Json data in a variable and want to display that data in Tabular form in asp.net 【发布时间】:2020-04-15 05:05:31 【问题描述】:

我想使用 ASP.NET 将其转换为表格格式

responsebody= [
        "name": "apple.com",
        "status": "regthroughothers",
        "classkey": "domcno"
    ,
    
        "name": "asdfgqwx.com",
        "status": "available",
        "classkey": "domcno"
    ,
    
        "name": "microsoft.org",
        "status": "unknown",
        "classkey": ""
    ,
    
        "name": "apple.org",
        "status": "unknown",
        "classkey": ""
    ,
    
        "name": "microsoft.com",
        "status": "regthroughothers",
        "classkey": "domcno"
    ,
    
        "name": "asdfgqwx.org",
        "status": "unknown",
        "classkey": "domcno"
    ]

【问题讨论】:

你能在问题中添加更多细节吗? 这能回答你的问题吗? Convert JSON to DataTable 您需要什么样的附加信息?@Manish @ThinleyNamgay 你可以通过添加一个清晰的标题/摘要来提高你的问题的质量,提供更多关于你想要做什么的背景,解释你尝试过的方法,以及为什么他们没有工作。更多建议:How to Ask. 我想把上面的Json字符串以表格的形式显示在网页上。 【参考方案1】:

我想答案取决于您使用的是 ASP.NET MVC 还是 WebForms、内置类型还是 3rd 方库。

这是 MVC 的示例。

1.您的控制器操作类似于:

public ActionResult DisplayJsonData()
        
            var json = @"
                'items' : [
                        'name': 'apple.com',
                        'status': 'regthroughothers',
                        'classkey': 'domcno'
                    ,
                    
                        'name': 'asdfgqwx.com',
                        'status': 'available',
                        'classkey': 'domcno'
                    ,
                    
                        'name': 'microsoft.org',
                        'status': 'unknown',
                        'classkey': ''
                    ,
                    
                        'name': 'apple.org',
                        'status': 'unknown',
                        'classkey': ''
                    ,
                    
                        'name': 'microsoft.com',
                        'status': 'regthroughothers',
                        'classkey': 'domcno'
                    ,
                    
                        'name': 'asdfgqwx.org',
                        'status': 'unknown',
                        'classkey': 'domcno'
                    
                ]
            "; 

            var model = JsonConvert.DeserializeObject<DisplayJsonModel>(json);
            return View(model);
        

和 DisplayJsonData.cshtml 视图:

@model WebApplication2.Models.DisplayJsonModel
@
    ViewBag.Title = "DisplayJsonData";


<h2>DisplayJsonData</h2>

<table class="table">
    <thead>
        <tr>
            <th>Name</th>
            <th>Status</th>
            <th>Class Key</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.Items)
        
            <tr>
                <td>@item.name</td>
                <td>@item.status</td>
                <td>@item.classkey</td>
            </tr>
        
    </tbody>
</table>

    如上所述,您还需要解析 JSON。

    公共类 DisplayJsonModel 公共 JsonItem[] 项目 获取;放;

    public class JsonItem
    
        public string name  get; set; 
        public string status  get; set; 
        public string classkey  get; set; 
    
    

这里是纯 JS:

<table class="table">
    <thead>
    <tr>
        <th>Name</th>
        <th>Status</th>
        <th>Class Key</th>
    </tr>
    </thead>
    <tbody id="jsTableBody"></tbody>
</table>

<script>
    var responsebody = [
        
            "name": "apple.com",
            "status": "regthroughothers",
            "classkey": "domcno"
        ,
        
            "name": "asdfgqwx.com",
            "status": "available",
            "classkey": "domcno"
        ,
        
            "name": "microsoft.org",
            "status": "unknown",
            "classkey": ""
        ,
        
            "name": "apple.org",
            "status": "unknown",
            "classkey": ""
        ,
        
            "name": "microsoft.com",
            "status": "regthroughothers",
            "classkey": "domcno"
        ,
        
            "name": "asdfgqwx.org",
            "status": "unknown",
            "classkey": "domcno"
        
    ];

    var tableRows = [];
    for (var i = 0; i < responsebody.length; i++) 
        tableRows.push("<tr>" +
            "<td>" + responsebody[i].name + "</td>" + 
            "<td>" + responsebody[i].status + "</td>" + 
            "<td>" + responsebody[i].classkey + "</td>" + 
            "</tr>");
    
    var tableBody = document.getElementById("jsTableBody");
    tableBody.innerhtml = tableRows.join('');
</script>

对于网络表单 您可能想考虑在 aspx 页面中使用类似 asp:DataGrid 的东西:

<asp:DataGrid runat="server" ID="grid" AutoGenerateColumns="False" CssClass="table table-bordered">
<Columns>
  <asp:BoundColumn DataField="name" HeaderText="Name" />
  <asp:BoundColumn DataField="status" HeaderText="Status" />
  <asp:BoundColumn DataField="classkey" HeaderText="Class Key" />
</Columns>
</asp:DataGrid>

在代码隐藏中:

var model = JsonConvert.DeserializeObject<DisplayJsonModel>(json);
grid.DataSource = model.Items;
grid.DataBind();

【讨论】:

感谢您的回复。我正在使用网络表单在网页中显示表格。 使用可能的网络表单变体更新答案。【参考方案2】:

您需要Newtonsoft.JsonConvert NuGet 包将您的 JSON 转换为与 C# 兼容的类型。在解决方案资源管理器中右键单击您的项目,然后单击“管理 NuGet 包”,然后搜索并安装它。

您还需要创建一个新类来以正确的格式存储数据。右键单击您的项目,将鼠标悬停在“添加”上,单击“类”。假设你所有的数据都是字符串格式:

public class Data
    
        public string name  get; set; 
        public string status  get; set; 
        public string classkey  get; set; 
    

返回到您的 JSON 变量所在的位置,添加 using Newtonsoft.Json;,然后使用如下代码:

List&lt;Data&gt; deserializedData = JsonConvert.DeserializeObject&lt;List&lt;Data&gt;&gt;(your variable name here);

这会将您的数据放入数据类型的列表中。从那里您可以将其插入 SQLite 数据库或执行任何操作,但您需要让您的问题更具体地说明“表格”的含义。

【讨论】:

【参考方案3】:

Visual Studio

第 1 步:通过 right-click 或 (CtrC + C) 将您的 JSON 复制到 clipboard

[
        "name": "apple.com",
        "status": "regthroughothers",
        "classkey": "domcno"
    ,
    
        "name": "asdfgqwx.com",
        "status": "available",
        "classkey": "domcno"
    ,
    
        "name": "microsoft.org",
        "status": "unknown",
        "classkey": ""
    ,
    
        "name": "apple.org",
        "status": "unknown",
        "classkey": ""
    ,
    
        "name": "microsoft.com",
        "status": "regthroughothers",
        "classkey": "domcno"
    ,
    
        "name": "asdfgqwx.org",
        "status": "unknown",
        "classkey": "domcno"
    ]

第 2 步:将指针放在要写的位置。

选择Edit >> Paste Special >> Paste JSON as Classes

结果:

    public class Rootobject
    
        public Class1[] Property1  get; set; 
    

    public class Class1
    
        public string name  get; set; 
        public string status  get; set; 
        public string classkey  get; set; 
    

第三步:你可以改变一些你想要的结果。然后,使用JsonConvert.DeserializeObject&lt;Foo&gt;(yourString) 来完成这项工作。

【讨论】:

感谢您的回复,但我已经创建了这个类。 检查this,@ThinleyNamgay

以上是关于在变量中有一个 Json 数据,并希望在 asp.net 中以表格形式显示该数据的主要内容,如果未能解决你的问题,请参考以下文章

将php变量传递给角度

如何在asp.net mvc中返回复杂的Json对象

ASP.NET + SQL SERVER + JSON = 如何在 SQL Server 的两个连接表中获取数据并加载为 JSON?

用asp.net的json响应返回一个特定的视图。

ASP .NET CORE 根据环境变量支持多个 appsettings.json

从本地 json 文件中获取数据并显示在 html asp.net mvc 中