current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.7 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 0 down vote favorite

I am newbie in learning AngularJS. Can anyone help me to understand how to get data from database using angularjs and entity-framework in mvc5.

Let's say we have data table named:
tbl_student {rollno, name}
and we want all the students data from the database. So what should be the most understandable way for new learners.

Angular-Code

var myApp = angular.module("MyModule", []);
myApp.controller("DBcontroller", function ($scope, $http) {
$http.get("AngularController/AllStudents")
    .then(function (response) {
        $scope.students = response.data
    })
})

Html-code in file named "Test.cshtml"

<body  ng-app="MyModule">
<table ng-controller="DBcontroller">
     <thead>
          <tr>
             <th>Name</th>
             <th>City</th>
             <th>Institute</th>
           </tr>
     </thead>
           <tr ng-repeat="student in students">
             <td>{{ student.Name }}</td>
             <td>{{ student.City }}</td>
             <td>{{ student.Institute }}</td>
          </tr>
 </table>
 </body>

In MVC Controller

public class AngularController : Controller
{
    // GET: Angular
    public ActionResult Test()
    {
        return View();
    }

    public JsonResult AllStudents()
    {
        using (EducationContext context = new EducationContext())
        {
            var students = context.tbl_Student.ToList();
            return Json(students, JsonRequestBehavior.AllowGet);
        }
    }
}
share|improve this question
    
are you receiving any error messages? – BviLLe_Kid Jun 22 '16 at 13:09
    
it says "Failed to load resource: the server responded with a status of 404 (Not Found)" and on clicking on error it says "The resource cannot be found." – WASIF Jun 22 '16 at 14:54
1  
Take Controller off of AngularController.. so it should just be $http.get("/Angular/AllStudents") – BviLLe_Kid Jun 22 '16 at 14:56
up vote 1 down vote accepted

The reason why this probably isn't working is because in your get you are adding the word Controller after Angular.

That is unnecessary.

This should work:

var myApp = angular.module('MyModule', []);
    myApp.controller('DBcontroller', function ($scope, $http) {
    $http.get('/Angular/AllStudents') // added an '/' along with deleting Controller portion
        .then(function (response) {
            $scope.students = response.data
        })
    })
share|improve this answer
    
now everything is fine, now the reason is that data is displayed on page through post-request but not by get-request. what could be the reason? – WASIF Jun 22 '16 at 15:11
    
@WASIF sorry, could you clarify what you are trying to ask? – BviLLe_Kid Jun 22 '16 at 15:13
    
In angular, $http.get() does not give me data but when I change it to $http.post() it gives me data on display. – WASIF Jun 22 '16 at 15:16
    
@WASIF maybe this will help – BviLLe_Kid Jun 22 '16 at 15:19
    
this is fine and it is telling about difference about $http.get() and $http.post() but I want to know how to get data through $http.get(), not by $http.post() – WASIF Jun 22 '16 at 15:29
up vote 0 down vote

If you add this in web.config file Http Get will also work

<configuration>
  <system.web>
    <webServices>
      <protocols>
       <add name="HttpGet"/>
      </protocols>
    </webServices>
  </system.web>
</configuration>
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.