Data table In MVC is show below.
In Model
In Model
public class Sample
{
public string UserName { get; set; }
public string FirstName { get; set; }
public string LastName { get; set; }
public string Location { get; set; }
public string Name { get; set; }
public string Path { get; set; }
public string Size { get; set; }
public List<Sample> images { get; set; }
public int Id{get;set;}
public List<Sample> Listgrid { get; set; }
KavithaEntities1 context = new KavithaEntities1();
public List<Sample> GetList()
{
List<Sample> ListDetails = new List<Sample>();
Sample Smpl = null;
var list = context.sp_GetList_Jqgrid().ToList();
for (int i = 0; i < list.Count(); i++)
{
Smpl = new Sample();
Smpl.UserName =
list[i].UserName;
Smpl.FirstName =
list[i].FirstName;
Smpl.LastName =
list[i].LastName;
Smpl.Location =
list[i].Location;
Smpl.Id = Convert.ToInt32(list[i].Id);
ListDetails.Add(Smpl);
}
return ListDetails;
}
}
In Controller:
public ActionResult DataTable()
{
Sample sample = new Sample();
List<Sample> lst = new List<Sample>();
lst = sample.GetList();
return View(lst);
}
In View
@model
IEnumerable<JQGridExample.Models.Sample>
@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
@* <link href="@Url.Content("~/Content/dataTables/demo_table.css")"
rel="stylesheet" type="text/css" />*@
<link href="~/Content/jquery.dataTables.css" rel="stylesheet" />
<script src="~/Scripts/DataTable/jquery-1.4.4.min.js"></script>
<script src="~/Scripts/DataTable/jquery.dataTables.min.js"></script>
<script src="~/Scripts/DataTable/jquery.dataTables.js"></script>
<script src="~/Scripts/DataTable/index.js"></script>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>MyView</title>
<script type="text/javascript">
$(document).ready(function () {
$('#tblObjects').dataTable({
});
});
</script>
</head>
<body>
<div>
<table id="tblObjects" class="datatable">
<thead>
<tr>
<th>User Name</th>
<th>First Name</th>
<th>Last Name</th>
<th>Location</th>
</tr>
</thead>
@if (Model != null && Model.Count()
> 0)
{
<tbody>
@foreach (var item in Model)
{
<tr>
<td>@Html.DisplayFor(modelItem =>item.UserName)</td>
<td>@Html.DisplayFor(modelItem => item.FirstName)</td>
<td>@Html.DisplayFor(modelItem => item.LastName)</td>
<td>@Html.DisplayFor(modelItem => item.Location)</td>
</tr>
}
</tbody>
}
</table>
</div>
</body>
</html>
No comments:
Post a Comment