c# - fetch data from database using angularjs in mvc -
facing trouble in fetching data database in mvc using angularjs.please help. here controller.js file , there 2 controller.
here service.js file there 2 method used 2 different controller.js file
app.service("myservice", function ($http) { //get eployee this.getemployees = function () { return $http.get("home/getall"); }; this.getemployeesall = function () { return $http.get("test/getalldata"); }; }); app.controller("contrl", function ($scope, myservice) { getemployeesall(); function getemployeesall() { var getdata = myservice.getemployeesall(); getdata.then(function (emp) { $scope.employees = emp.data; }, function () { alert('error in getting records'); }); } }); here service.js file there 2 method used 2 different contr
controller.js
app.controller("mycntrl", function ($scope, myservice) { $scope.divemployee = false; getallemployee(); //to records function getallemployee() { var getdata = myservice.getemployees(); getdata.then(function (emp) { scope.employees = emp.data; },function () { alert('error in getting records'); }); } here homecontroller .in there methods.
using system; using system.collections.generic; using system.linq; using system.web; using system.web.mvc; using goodexample.models; namespace goodexample.controllers { public class homecontroller : controller { // get: /home/ public actionresult index() { return view(); } public jsonresult getall() { using (sampledbentities datacontext = newsampledbentities()) { var employeelist = datacontext.employees.tolist(); return json(employeelist,jsonrequestbehavior.allowget); } } } } index.cshtml
@{ viewbag.title = "index"; } <div ng-controller="mycntrl"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <h1> employee details page</h1> <br/> <input type="button" class="btnadd" value=" add employee" ng-click="addemployeediv()" /> <a href='@url.action("site", "test")'> <input type='button' value='dummy button' /> </a> <div class="divlist"> <p class="divhead">employee list</p> <table cellpadding="12" class="table table-bordered table-hover"> <tr> <td><b>id</b></td> <td><b>name</b></td> <td><b>email</b></td> <td><b>age</b></td> <td><b>actions</b></td> </tr> <tr ng-repeat="employee in employees"> <td>{{employee.id}}</td> <td>{{employee.name}}</td> <td>{{employee.email}}</td> <td>{{employee.age}}</td> <td> <span ng-click="editemployee(employee)" class="btnadd">edit</span> <span ng-click="deleteemployee(employee)" class="btnred">delete</span> </td> </tr> </table> </div> <div ng-show="divemployee"> <p class="divhead">{{action}} employee</p> <table> <tr> <td><b>id</b></td> <td><input type="text" disabled="disabled" ng-model="employeeid" /></td> </tr> <tr> <td><b>name</b></td> <td><input type="text" ng-model="employeename" /></td> </tr> <tr> <td><b>email</b></td> <td><input type="text" ng-model="employeeemail" /></td> </tr> <tr> <td><b>age</b></td> <td><input type="text" ng-model="employeeage" /> </td> </tr> <tr> <td colspan="2"><input type="button" class="btnadd" value="save" ng-click="addupdateemployee()" /></td> </tr> </table> </div> </div> here testcontroller file
using system; using system.collections.generic; using system.linq; using system.web; using system.web.mvc; using goodexample.models; namespace goodexample.controllers { public class testcontroller : controller { // get: /test/ public actionresult demo() { return view(); } public jsonresult getalldata() { using (sampledbentities datacontext = new sampledbentities()) { var employeelist = datacontext.employees.tolist(); return json(employeelist, jsonrequestbehavior.allowget); } } } } test.cshtml
@{ viewbag.title = "demo"; } <div ng-controller="contrl"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <h1>test</h1><br/> @*<input type="button" class="btnadd" value=" add employee" ng-click="addemployeediv()" />*@ <a href='@url.action("site", "home")'> <input type='button' value='dummy button' /> </a> <div class="divlist"> <p class="divhead">employee list</p> <table cellpadding="12" class="table table-bordered table-hover"> <tr> <td><b>id</b></td> <td><b>name</b></td> <td><b>email</b></td> <td><b>age</b></td> <td><b>actions</b></td> </tr> <tr ng-repeat="employee in employees"> <td>{{employee.id}}</td> <td>{{employee.name}}</td> <td>{{employee.email}}</td> <td>{{employee.age}}</td> <td> @*<span ng-click="editemployee(employee)" class="btnadd">edit</span> <span ng-click="deleteemployee(employee)" class="btnred">delete</span>*@ </td> </tr> </table> </div> </div> but not showing data in second testcontroller.cs.please how show data in testcontroller.cs
Comments
Post a Comment