Asp.net core show data in grid using third party tool

There are several third-party grid libraries available for use with ASP.NET Core, each offering different features, customization options, and performance characteristics.

Syncfusion Grid for ASP.NET Core – Complete source code available at Syncfusion_sample

Sample code- Index.cshtml

@{
    var Dropdownlist = new Syncfusion.EJ2.DropDowns.DropDownList() { DataSource = ViewData["states"], Query = "new ej.data.Query()", AllowFiltering = true, Fields = new Syncfusion.EJ2.DropDowns.DropDownListFieldSettings() { Value = "ID", Text = "Name" } };
}

<ejs-grid id="Grid" dataSource="@ViewData["customers"]" toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel","Search" })"
          allowPaging="true" allowSorting="true">
    <e-data-manager crudUrl="/Home/CrudUpdate" adaptor="UrlAdaptor" url="/Home/UrlDatasource"></e-data-manager>
    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" newRowPosition="Top"></e-grid-editSettings>
    <e-grid-filtersettings type="Menu"></e-grid-filtersettings>
    <e-grid-pagesettings pageCount="5"></e-grid-pagesettings>
    <e-grid-columns>
        <e-grid-column field="EmpName" headerText="EmpName" textAlign="Right" width="120"></e-grid-column>
        <e-grid-column field="EmpSalary" headerText="EmpSalary" validationRules="@(new { required=true})" width="150"></e-grid-column>
        <e-grid-column field="StateName" headerText="State" width="120" editType="dropdownedit" edit="new {@params = Dropdownlist}"></e-grid-column>
    </e-grid-columns>
</ejs-grid>

<script src="https://cdn.syncfusion.com/ej2/24.1.41/dist/ej2.min.js"></script>
<link rel="stylesheet" href="https://cdn.syncfusion.com/ej2/23.1.36/fluent.css" />
<ejs-scripts></ejs-scripts>

DevExpress ASP.NET Core GridView – Complete source code available at DevExpress_sample

Sample code – Index.cshtml

@(Html.DevExtreme().DataGrid<Customer>()
    .ID("gridContainer")
   .ShowBorders(true)
    .FilterRow(filterRow => filterRow
        .Visible(true)
        .ApplyFilter(GridApplyFilterMode.Auto)
    )
    .SearchPanel(searchPanel => searchPanel
        .Visible(true)
        .Width(240)
        .Placeholder("Search...")
    )
    .HeaderFilter(headerFilter => headerFilter.Visible(true))
    .Paging(paging => paging.Enabled(true))
    .Editing(editing =>
    {
        editing.Mode(GridEditMode.Row);
        editing.AllowAdding(true);
        editing.AllowDeleting(true);
        editing.AllowUpdating(true);
    })
    .Columns(columns =>
    {
        columns.AddFor(m => m.ID);
        columns.AddFor(m => m.EmpName);
        columns.AddFor(m => m.EmpSalary);
        columns.AddFor(m => m.StateID)
            .Width(125)
            .Lookup(lookup => lookup
                .DataSource(d => d.Mvc().Controller("Home").LoadAction("GetStates").Key("ID"))
                .DisplayExpr("Name")
                .ValueExpr("ID")
            );
    })
    .DataSource(d => d.Mvc()
        .Controller("Home")
        .LoadAction("Get")
        .UpdateAction("Put")
        .InsertAction("Post")
        .DeleteAction("Delete")
        .Key("ID")
    )
)

Before choosing a third-party grid tool, consider your specific requirements, such as the features you need, licensing costs, and ease of integration with your ASP.NET Core application. Additionally, make sure to check for the latest versions and updates to ensure compatibility with your project and the ASP.NET Core framework.

-Thank you, happy coding !!