Hi mahesh213,
Check this example. Now please take its reference and correct your code.
Controller
public class HomeController : Controller
{
// GET: /Home/
public ActionResult Index()
{
return View();
}
[HttpGet]
public JsonResult GetAllRecords()
{
return Json(GetRecordList(), JsonRequestBehavior.AllowGet);
}
[HttpPost]
public JsonResult GetRecordsBasedOnTranscationPeriod(string period)
{
DateTime fromDate = DateTime.Now, toDate = DateTime.Now;
if (period.ToLower() == "today")
{
toDate = DateTime.Now;
}
else if (period.ToLower() == "1month")
{
toDate = DateTime.Now.AddMonths(-1);
}
else if (period.ToLower() == "2month")
{
toDate = DateTime.Now.AddMonths(-2);
}
return Json(GetRecordList().Where(x => x.Tdate.Date >= toDate.Date && x.Tdate.Date <= fromDate.Date).ToList());
}
public List<Records> GetRecordList()
{
List<Records> records = new List<Records>();
records.Add(new Records { TId = 1, Tdate = DateTime.Now, Name = "Test 1", Amount = 5, Creditbal = 1000 });
records.Add(new Records { TId = 4, Tdate = DateTime.Now, Name = "Test 4", Amount = 8, Creditbal = 4000 });
records.Add(new Records { TId = 5, Tdate = DateTime.Now, Name = "Test 5", Amount = 3, Creditbal = 5000 });
records.Add(new Records { TId = 2, Tdate = DateTime.Now.AddMonths(-1), Name = "Test 2", Amount = 3, Creditbal = 2000 });
records.Add(new Records { TId = 3, Tdate = DateTime.Now.AddMonths(-1), Name = "Test 3", Amount = 2, Creditbal = 3000 });
records.Add(new Records { TId = 7, Tdate = DateTime.Now.AddMonths(-1), Name = "Test 7", Amount = 7, Creditbal = 7000 });
records.Add(new Records { TId = 6, Tdate = DateTime.Now.AddMonths(-2), Name = "Test 6", Amount = 4, Creditbal = 6000 });
records.Add(new Records { TId = 8, Tdate = DateTime.Now.AddMonths(-2), Name = "Test 8", Amount = 6, Creditbal = 8000 });
records.Add(new Records { TId = 9, Tdate = DateTime.Now.AddMonths(-2), Name = "Test 9", Amount = 1, Creditbal = 9000 });
return records;
}
}
public class Records
{
public int TId { get; set; }
public DateTime Tdate { get; set; }
public string Name { get; set; }
public int Amount { get; set; }
public double Creditbal { get; set; }
}
View
<html>
<head>
<title>Index</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" />
<script type="text/javascript">
var app = angular.module('MyApp', []);
app.controller("MyController", function ($scope, $http, $window) {
GetAllRecords();
function GetAllRecords() {
$http({ method: 'Get', url: '/Home/GetAllRecords'
}).success(function (data, status, headers, config) {
$scope.Records = data;
});
}
$scope.Search = function () {
var data = { period: $scope.TranscationPeriod };
GetRecordsBasedOnTranscationPeriod(data);
}
function GetRecordsBasedOnTranscationPeriod(data) {
$http({
method: 'POST',
url: 'Home/GetRecordsBasedOnTranscationPeriod',
params: data
}).then(function (response) {
$scope.Records = response.data;
}, function error(response) {
alert(response.responseText);
});
}
});
</script>
</head>
<body>
<div ng-app="MyApp" ng-controller="MyController">
<select id="ddlTranscationPeriod" ng-model="TranscationPeriod">
<option value="">Select</option>
<option value="Today">Today</option>
<option value="1Month">Last one month</option>
<option value="2Month">Last 2 month</option>
</select>
<input type="button" value="Search" ng-click="Search()" class="btn btn-default" />
<hr />
<table class="table table-table-responsive">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Date</th>
<th>Amount</th>
<th>Balance</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="record in Records">
<td>{{ record.TId }}</td>
<td>{{ record.Name }}</td>
<td>{{ record.Tdate.slice(6,-2) | date:'dd-MMM-yyyy'}}</td>
<td>{{ record.Amount }}</td>
<td>{{ record.Creditbal }}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Screenshot
