Ahmed Abdulrahman
Ahmed Abdulrahman

Reputation: 469

How to fetch data in ASP.Net MVC using AngularJS?

Hi Developers and Engineers, I am trying to fetch data from Database in a table format using AngularJS and Datatables, but when I run the application I can not see any data I don't know what is wrong?

This my App Module:

var app = angular.module('MyApp', ['datatables']); app.controller('homeCtrl', ['$scope', '$http', 'DTOptionsBuilder', 'DTColumnBuilder',
function ($scope, $http, DTOptionsBuilder, DTColumnBuilder) {
    $scope.dtColumns = [
        DTColumnBuilder.newColumn("CustomerID", "Customer ID"),
        DTColumnBuilder.newColumn("CompanyName", "Company Name"),
        DTColumnBuilder.newColumn("ContactName", "Contact Name"),
        DTColumnBuilder.newColumn("ContactTitle", "Contact Title"),
        DTColumnBuilder.newColumn("Address", "Address"),
        DTColumnBuilder.newColumn("City", "City")
    ]

    $scope.dtOptions = DTOptionsBuilder.newOptions().withOption('ajax', {
        url: "/home/getdata",
        type: "POST"
    })
    .withPaginationType('full_numbers')
    .withDisplayLength(10);
}]);

The MVC Controller:

 public class HomeController : Controller
{

    public ActionResult Index()
    {
        return View();
    }
    // Fetching Data from Customer Table
    public ActionResult getData()
    {
        using (MyDatabaseEntities dc = new MyDatabaseEntities())
        {
            return Json(dc.Customers.ToList());
        }
    }


}

the View of the controller and JS Order: enter image description here

Upvotes: 2

Views: 1275

Answers (1)

Alexz S.
Alexz S.

Reputation: 2555

However I'd do it in a different way also redesign your solution, you're missing JsonRequestBehavior.AllowGet as a second parameter in your return Json.

return Json(dc.Customers.ToList(), JsonRequestBehavior.AllowGet);

It is needed as the method signature you're calling deny Json requests in HttpGet method, if you decompile System.Web.Mvc.Controller you will find it.

The get is initially denied to avoid a specific attack with Json, it's called JSON Hijacking, Pill's describe more in his blog Json Hijacking.

Upvotes: 1

Related Questions