Hi skp,
Check this example. Now please take its reference and correct your code.
Controller
public class HomeController : Controller
{
// GET: /Home/
public ActionResult Index()
{
return View();
}
[HttpPost]
public JsonResult GetDetails(int id)
{
List<Customer> customers = new List<Customer>();
customers.Add(new Customer { Id = 1, Name = "John Hammond", Country = "United States" });
customers.Add(new Customer { Id = 2, Name = "Mudassar Khan", Country = "India" });
customers.Add(new Customer { Id = 3, Name = "Suzanne Mathews", Country = "France" });
customers.Add(new Customer { Id = 4, Name = "Robert Schidner", Country = "Russia" });
return Json(customers.Where(x => x.Id == id).FirstOrDefault(), JsonRequestBehavior.AllowGet);
}
public class Customer
{
public int Id { get; set; }
public string Name { get; set; }
public string Country { get; set; }
}
}
View
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script>
<script type="text/javascript">
var app = angular.module("MyApp", []);
app.controller("MyController", function ($scope, $http) {
$scope.Customers = [
{ Id: 1, Name: "John Hammond" },
{ Id: 2, Name: "Mudassar Khan" },
{ Id: 3, Name: "Suzanne Mathews"}];
$scope.GetValues = function (customer) {
customer.HasChecked = !customer.HasChecked;
if (customer.HasChecked) {
$http({
method: 'Post',
url: '/Home/GetDetails',
params: { id: customer.Id }
}).success(function (data) {
$scope.Country = data.Country;
}).error(function (data) {
});
} else {
$scope.Country = "";
}
};
});
</script>
<div ng-app="MyApp" ng-controller="MyController">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<th></th>
<th>Id</th>
<th>Name</th>
</tr>
<tr ng-repeat="c in Customers">
<td><input type="checkbox" ng-change="GetValues(c)" ng-model="m.HasChecked" /></td>
<td>{{c.Id}}</td>
<td>{{c.Name}}</td>
</tr>
</table>
<hr />
Selected Customer Country is : <span><b>{{Country}}</b></span>
</div>
Screenshot
