webgrid in mvc 4 razor

Webgrid in MVC 4 razor

Hell everyone, I am going to share the code sample for how to use Add, Update and Delete in MVC WebGrid.

If we need to display data in our app, we look for a asp.net grid view. The ASP.net Grid view is always perform to display all the data and other activities like add items, update items and delete items etc. 

But in MVC, for the same we use MVC WebGrid control. The MVC WebGrid not have features to perform the operation like add, update and delete that time we need to put some extra work to achieve this functionality. 

The code sample as given below.
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
//MVC WebGrid control
@model IEnumerable<MedC.Svc.Data.Doctor>
<h4>Doctor List</h4>
<p>
    @Html.ActionLink("Create New", "Create")
</p>
@{
    WebGrid grid = new WebGrid(Model, canPage: true, rowsPerPage: 5,canSort:true);
}
<div id="GridContent">
    @grid.GetHtml(tableStyle: "webgrid-table", headerStyle: "webgrid-header", footerStyle: "webgrid-footer",  
    htmlAttributes:new{@id="webGrid"},
       columns: grid.Columns(
       grid.Column(columnName: "RegistrationNumber", format: @<text>@item.RegistrationNumber</text>),
       grid.Column("RegisteredWithMedicalAuthoritySince", format: @<text>@item.RegisteredWithMedicalAuthoritySince</text>),
       grid.Column("Specialization", format: @<text>@item.Specialization</text>),
       grid.Column("RegistrationAuthority", format: @<text>@item.RegistrationAuthority</text>),
       grid.Column("RegistrationCertificate", format: @<text>@item.RegistrationCertificate</text>),
       grid.Column("Tags", format: @<text>@item.Tags</text>),
       grid.Column("Introduction", format: @<text>@item.Introduction</text>),
       grid.Column("IsFeatured", format: @<text>@item.IsFeatured</text>),
       grid.Column("Rating", format: @<text>@item.Rating</text>),
       grid.Column("Awards", format: @<text>@item.Awards</text>),              
       grid.Column("",format:@<text>
            @Html.ActionLink("Edit", "Edit", new { id = item.Id }) |
            @Html.ActionLink("Details", "Details", new { id = item.Id }) |
            @Html.ActionLink("Delete", "Delete", new { id = item.Id }</text>)
         )
     )
</div>
//MVC WebGrid control

@model IEnumerable<MedC.Svc.Data.Doctor>
<h4>Doctor List</h4>
<p>
    @Html.ActionLink("Create New", "Create")
</p>
@{
    WebGrid grid = new WebGrid(Model, canPage: true, rowsPerPage: 5,canSort:true);
}
<div id="GridContent">
    @grid.GetHtml(tableStyle: "webgrid-table", headerStyle: "webgrid-header", footerStyle: "webgrid-footer",   
    htmlAttributes:new{@id="webGrid"},
       columns: grid.Columns(
       grid.Column(columnName: "RegistrationNumber", format: @<text>@item.RegistrationNumber</text>),
       grid.Column("RegisteredWithMedicalAuthoritySince", format: @<text>@item.RegisteredWithMedicalAuthoritySince</text>),
       grid.Column("Specialization", format: @<text>@item.Specialization</text>),
       grid.Column("RegistrationAuthority", format: @<text>@item.RegistrationAuthority</text>),
       grid.Column("RegistrationCertificate", format: @<text>@item.RegistrationCertificate</text>),
       grid.Column("Tags", format: @<text>@item.Tags</text>),
       grid.Column("Introduction", format: @<text>@item.Introduction</text>),
       grid.Column("IsFeatured", format: @<text>@item.IsFeatured</text>),
       grid.Column("Rating", format: @<text>@item.Rating</text>),
       grid.Column("Awards", format: @<text>@item.Awards</text>),               
       grid.Column("",format:@<text>
            @Html.ActionLink("Edit", "Edit", new { id = item.Id }) |
            @Html.ActionLink("Details", "Details", new { id = item.Id }) |
            @Html.ActionLink("Delete", "Delete", new { id = item.Id }</text>)
         )
     )

</div>
ANIL SINGH

Hey! I'm Anil Singh. I author this blog. I'm Active Blogger, Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
http://www.code-sample.com
http://www.code-sample.xyz

You Might Also Like
Post a Comment
www.code-sample.com/. Powered by Blogger.