python ruby-programming-language Smalltalk Vue.js Knockoutjs TypeScript JavaScript, OOPs JavaScript Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 4 Angular 2 AngularJs 1.x NodeJs Perl Programming R Programming RequireJs Rust Programming Backbonejs closure programming language go-programming-language kotlin-programming-language
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

Hi there! Welcome to my blog. My name is Anil Singh. I'm a author of this blog. For more detail about me, kindly refer to this link..
My Blogs - http://code-sample.com and http://code-sample.xyz
My Books - Interview Questions and Answers Books- Get Your Book in 15+ Digital Stores Worldwide..

You Might Also Like
www.code-sample.com/. Powered by Blogger.
ASK Questions