Hi SUJAYS,
Check this example. Now please take its reference and correct your code.
Database
For this example I have used of NorthWind database that you can download using the link given below.
Download Northwind Database
Model
public class EmployeeModel
{
public int EmployeeId { get; set; }
public string FirstName { get; set; }
public string LastName { get; set; }
public string Country { get; set; }
public DateTime? DOB { get; set; }
}
Controller
public class HomeController : Controller
{
// GET: /Home/
public ActionResult Index()
{
return View();
}
[HttpPost]
public JsonResult GetEmployees()
{
NorthwindEntities entities = new NorthwindEntities();
List<EmployeeModel> employees = entities.Employees
.Select(x => new EmployeeModel
{
EmployeeId = x.EmployeeID,
FirstName = x.FirstName,
LastName = x.LastName,
Country = x.Country,
DOB = x.BirthDate
}).ToList();
return Json(employees);
}
}
View
<div ng-app="MyApp" ng-controller="MyController">
<input type="button" value="Generate Table" ng-click="GenerateTable()" />
<hr />
<table ng-show="IsVisible">
<tr>
<th>
Employee Id
</th>
<th>
First Name
</th>
<th>
Last Name
</th>
<th>
Country
</th>
<th>
Date of Birth
</th>
</tr>
<tbody ng-repeat="emp in Employees">
<tr>
<td>
{{emp.EmployeeId}}
</td>
<td>
{{emp.FirstName}}
</td>
<td>
{{emp.LastName}}
</td>
<td>
{{emp.Country}}
</td>
<td>
{{emp.DateofBirth}}
</td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module('MyApp', [])
app.controller('MyController', function ($scope, $http, $window) {
$scope.IsVisible = false;
$scope.GenerateTable = function () {
var post = $http({
method: "POST",
url: "/Home/GetEmployees",
dataType: 'json',
data: {},
headers: { "Content-Type": "application/json" }
});
post.success(function (data, status) {
var employees = [];
for (var i = 0; i < data.length; i++) {
var emp = {};
emp.EmployeeId = data[i].EmployeeId;
emp.FirstName = data[i].FirstName;
emp.LastName = data[i].LastName;
emp.Country = data[i].Country;
// Converting JSON Date To JavaScript Date.
emp.DateofBirth = ConvertJsonDateToDateTime(data[i].DOB);
employees.push(emp);
}
$scope.Employees = employees;
$scope.IsVisible = true;
});
post.error(function (data, status) {
$window.alert(data.Message);
});
};
});
function ConvertJsonDateToDateTime(date) {
var parsedDate = new Date(parseInt(date.substr(6)));
var newDate = new Date(parsedDate);
var month = newDate.getMonth() + 1;
var day = newDate.getDate();
var year = newDate.getFullYear();
return day + "/" + month + "/" + year;
}
</script>
Screenshot
