how to use grid in mvc

Please use below links:-
http://www.codeproject.com/Tips/597253/Using-the-Grid-MVC-in-ASP-NET-MVC
http://forums.asp.net/t/1725726.aspx?how+to+use+grid+in+MVC

Kishore22, if this helps please login to Mark As Answer. | Alert Moderator

http://stackoverflow.com/questions/12815267/how-to-use-webgrid-asp-net-mvc-3-0
http://stackoverflow.com/questions/18454164/how-to-retrieve-date-value-from-database-to-textbox-in-asp-net
http://msdn.microsoft.com/en-us/library/6759sth4(v=vs.90).aspx
http://msdn.microsoft.com/en-us/library/ms178359(v=vs.110).aspx

Kishore22, if this helps please login to Mark As Answer. | Alert Moderator

hi..
http://www.codeproject.com/Tips/597253/Using-the-Grid-MVC-in-ASP-NET-MVC

SAMIR
Sr. Software Engineer

Kishore22, if this helps please login to Mark As Answer. | Alert Moderator

Hi,

Please go through the following code:

Step 1:

Write the following Action Method in your controller:

Freshers2012Entities1 entities = new Freshers2012Entities1();

public ActionResult JobPostings(int? Page)
{
var jobs = from j in entities.JobPostings
select new
{
Title = j.Title,
JobCode = j.JobCode,
Location = j.Location,
PostedOn = j.PostedOn
};
return View(jobs.ToList());
}
Here, I have used entity framework and Freshers2012Entities1 is my edmx model name.

Step 2:

Write the following code in your view:

@{
ViewBag.Title = "JobPostings";
}
<style type="text/css">
.gridTable
{
margin: 5px;
padding: 10px;
border: 1px #c8c8c8 solid;
border-collapse: collapse;
min-width: 550px;
background-color: #fff;
color: #fff;
}
.gridHead th
{
font-weight: bold;
background-color: #000000;
color: #fff;
padding: 10px;
}
.gridHead a:link, .gridHead a:visited, .gridHead a:active, .gridHead a:hover
{
color: #FFBBFF;
}
.gridHead a:hover
{
text-decoration: underline;
}
.gridTable tr.gridAltRow
{
background-color: #efeeef;
}
.gridTable tr:hover
{
background-color: #FFCCCC;
}
.gridAltRow td
{
padding: 10px;
margin: 5px;
color: #333;
}
.gridRow td
{
padding: 10px;
color: #333;
}
.gridFooter td
{
padding: 10px;
background-color: #c7d1d6;
color: #999;
font-size: 12pt;
text-align: center;
}
.gridFooter a
{
font-weight: bold;
color: #333;
border: 1px #333 solid;
}
.</style>
<script src="../../Scripts/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<div align="center" style="background-color: Black; color: Orange; font-weight: bold;
width: 83%; font-size: x-large">
List of Job Postings
<br />
<br />
<a href="@Url.Action("AddEditPosting", "Employer")">
<img id="img4" src="/Images/AddJobPosting.gif" alt="AddEditPosting" /></a>
<br />
</div>
<br />
<div>
@{
var grid = new WebGrid(Model, canPage: true, rowsPerPage: 10);

grid.Pager(WebGridPagerModes.NextPrevious);

@grid.GetHtml(tableStyle: "gridTable",
htmlAttributes: new { id = "DataTable" },
headerStyle: "gridHead",
footerStyle: "gridFooter",
rowStyle: "gridRow",
alternatingRowStyle: "gridAltRow",
columns: grid.Columns(


grid.Column("Title"),

grid.Column("JobCode"),

grid.Column("Location"),

grid.Column("PostedOn"),

grid.Column("", format:@<text><a href="@Url.Action("ShowJobOnJobCode", new { JobCode=@item.JobCode })"><img src="@Url.Content("~/Images/ShowDetails.gif")", alt="Edit" /></a></text>)

));

}
</div>
<div>
@if (TempData["ShowJobOnJobCode"]!=null)
{
Html.RenderPartial("ShowJobDetailsOnJobCodePV", (JobSiteSeekers.Models.JobPosting)TempData["ShowJobOnJobCode"]);
}
</div>

Please mark as answer if satisfied.........


Regards,
Shree M.

Kavya Shree Mandapalli

Kishore22, if this helps please login to Mark As Answer. | Alert Moderator