'Need help populating an ASP.net gridview using JSON datasource in c#

I have to create a gridview that is automatically populated with JSON.

I have created the JSON folder, it works fully, i can save data to it no problem.

The issue im having is now making my gridview in my ASP.net to automatically populate the form USING my JSON file.

I have tried using visual studios inbuilt LINQ wizard... It populated the headers of the gridview but not the fields itself.

Its a very simple gridview with 2 columns.

My current asp gridview code:

<asp:GridView ID="GridView1" AutoGenerateColumns="False
           " ShowHeaderWhenEmpty="True" EmptyDataText="No records Found" runat="server"  DataSourceID="Grid" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
            <Columns>
                <asp:BoundField DataField="id" HeaderText="id" ReadOnly="True" SortExpression="id" />
                <asp:BoundField DataField="Title" HeaderText="Title" ReadOnly="True" SortExpression="Title" />
            </Columns>
        </asp:GridView>
        <asp:LinqDataSource ID="Grid" runat="server" ContextTypeName="BookCollection" EntityTypeName="" OrderBy="id, Title" Select="new (id, Title)" TableName="Books">
        </asp:LinqDataSource>

short sample of my JSON below (has one entry only atm, just showing the attributes)(Two total: id, and Title.)

{"Books":[{"id":1,"Title":"Harry Potter"}]}

My gridview does NOT load when opened in a browser, but I'm assuming this is because the datasource is not linked properly yet or have a page load function because i don't know what to do.

As you can tell i am very new to coding so sorry if i left anything out.

Any help would be GREATLY appreciated.

c++sharpasp.netjsongridview


Solution 1:[1]

I agree other answers on this page, just wanted to add code sample on how to achieve that. I'm removing DataSource from your aspx control as I will set it in code behind.

Webform

<asp:GridView ID="GridView1" AutoGenerateColumns="False"
        ShowHeaderWhenEmpty="True" EmptyDataText="No records Found" runat="server" 
        OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
    <Columns>
        <asp:BoundField DataField="Id" HeaderText="Id" ReadOnly="True" SortExpression="id" />
        <asp:BoundField DataField="Title" HeaderText="Title" ReadOnly="True"
                   SortExpression="Title" />
    </Columns>
</asp:GridView>

Code behind

protected void Page_Load(object sender, EventArgs e)
{
    string jsonString = "{\"Books\":[{\"id\":1,\"Title\":\"Harry Potter\"}, {\"id\":2,\"Title\":\"Bible\"}]}";
    var json = (new JavaScriptSerializer()).Deserialize(jsonString, typeof(BooksSource));
    GridView1.DataSource = ((BooksSource)json).Books;
    GridView1.DataBind();
}

Note: In your case you'll be reading json from a text file instead, with something like File.ReadAllText(path); or using streams if you work with large files.

Data source classes

public class BooksSource
{
    public List<Book> Books { get; set; }
}

public class Book
{
    public string Id { get; set; }
    public string Title { get; set; }
}

Solution 2:[2]

Create a class that represent your json structure, like field names and data types, string, integer, etc.

Then in the page load event tead rhe json file, as you normally do with a text file.

Serialize the json string you have read to a list of classes previously created and assign it as datasource to the gridview.

Remove the linq datasource you don't need it

Solution 3:[3]

I believe instead of directly assigning your json data as the data source, you can instead create a new list or a datable, if you want a table like datatype. You can populate this new list or datatable with your json data and assign it as the GridView's datasource.

Depending on how big your json file is, this method should be work fine.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 Giox
Solution 3 Mohamed Najiullah

Related Questions