Click here to Skip to main content
16,017,340 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
i have one table and some colums ..how can i create Grid View for That in MVc 4.0 Cshtml page?
Please send me.
Posted

1 solution

You have two options to make grid in mvc:

1) Using foreach loop in view.

Add following model list at the top of the page.

// List of the model with data
@model List<modellist>  like @model List<mvc_project.model.studentmodel>

<table>
    <tr>
        <th>
           First Name
        </th>
        <th>
            Last Name
        </th>
    </tr>
    @foreach (var item in Model)
    {
        <tr>
            <td>
                @item.FirstName
            </td>
            <td>
                @item.LastName
            </td>
        </tr>
    }
</table>


Note: But have to do custom paging, sorting in this type of grid. So I suggest you to user WebGrid like follows.

2) WebGrid Example.

C#
@{
    var grid = new WebGrid(source: Model, canPage: true, canSort: false);
}
@grid.GetHtml(
    htmlAttributes: new { id = "gridId" },
    fillEmptyRows: false,
    mode: WebGridPagerModes.All,
    firstText: "<< First",
    previousText: "< Prev",
    nextText: "Next >",
    lastText: "Last >>",

columns: new[] {
        grid.Column("FirstName", "Name"),
        grid.Column("LastName", "Last Name"),
               //add edit, delete links
                grid.Column(columnName: "Edit", format: (item) => Html.ActionLink("Edit", "Edit", new { id = item.id })),
                grid.Column(columnName: "Delete", format: (item) => Html.ActionLink("Delete", "Delete", new { id = item.id }, new { onclick = "return confirm('Are you sure you want to delete this record?');" }))
                }
)


WebGrid is the best way in mvc to make to show data in grid because you have no need to do custom paging, sorting.
 
Share this answer
 
v5
Comments
Member 11405735 31-Jan-15 11:36am    
Hello myself mihir kadiya above displayed code is perfect but when i implement this code then paging is not displayed on grid and sorting is not applied yet so my question is that how implement that paging please give me solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900