Angular JS Json data

Question

I am self educating myself in angular js. For this i have created a project modelled after an actual project in my job

All get operation work fine but POST is giving me issue

My controller.js

var ngapp = angular.module('ngWebApp', ['angularUtils.directives.dirPagination']);
ngapp.controller('ngIndexController', function ($scope, ngDashboardService) {
 $scope.exportData = function (selectedDataList) {

    var getData = ngDashboardService.AddReportAudit(selectedDataList)
    getData.then(function (result) {
            alert(result.data);
        }, function () {
            alert('Error in getting records');
        });        
    };
});

My service.js

angular.module('ngWebApp').service("ngDashboardService", function ($http) {
    this.AddReportAudit = function (dataList) {
        var response = $http({
            method: "POST",
            url: "/Home/AddReportAudit",
            data: {
            'dataList': JSON.stringify(dataList)
            }
        });
        return response;
    };
});

My code of JasonResult in HomeController

 public JsonResult AddReportAudit(List<ADTOWebSMARTT_SSOData> dataList)
 {
    if (dataList != null)
    {
        using (HRMSystemEntities contextObj = new HRMSystemEntities())
        {
            var itemList = dataList.Where(x => x.IsChecked == true).ToList();
            itemList.ForEach(a => a.DateChecked = DateTime.Now);
            contextObj.SaveChanges();
            return Json(new { success = true });
        }
    }
    else
    {
        return Json(new { success = false });
    }
}

The problem occurs here public JsonResult AddReportAudit(List dataList) For some reason the dataList on reaching AddReportAudit become empty i.e. list has zero element. dataList has 30 records in controller.js and service.js.

I am not sure why that is happening. is there a parsing that I am missing when json data comes from angular to c#

Did you try to put [FromBody] in front of your list parameter for AddReportAudit? Also, put contentType:'application/json' and dataType:'json' in your angular request. — Dylan
– Dylan, Commented Mar 17, 2017 at 15:09

Pramod_Para · Accepted Answer · 2017-03-17 15:22:53Z

2

You are actually sending an Object, so the data that reaches your public JsonResult AddReportAudit(....isAnObject), but you are expecting it to be a list. Just change your controller code to the snippet below, it should work.

angular.module('ngWebApp').service("ngDashboardService", 
    function($http) {
       this.AddReportAudit = function (dataList) {
          var response = $http({
             method: "POST",
             url: "/Home/AddReportAudit",
             data:JSON.stringify(dataList)
          });
       return response;
    };
});

answered Mar 17, 2017 at 15:22

Pramod_Para

6833 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

DotNetBeginner Over a year ago

u my friend are a genious

ochs.tobi · Accepted Answer · 2018-08-07 06:35:00Z

Solution for angular 1. Place your web service url and change the json data format as per your need. It works.

<!DOCTYPE html>
<html>
<head>
    <title>Angular HTTP service</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
    <table>
        <tr>
            <th>S No</th>
            <th>Source Name</th>
        </tr>
        <tr ng-repeat="res in result">
            <td>{{$index + 1}}</td>
            <td>{{res.source_name}}</td>
        </tr>


    </table>
    <script type="text/javascript">
        var app = angular.module("myApp", []);
        app.controller("myCtrl", function($scope, $http){
            $http.get("http://127.0.0.1:4000/all_source").then(function(res){
                //console.log(res.data.result);
                //console.log(res);
                $scope.result = res.data.result;
            });
        });
    </script>
</body>
</html>

Please read this meta question and make sure, that you don't include a picture next time, but the text itself.

Collectives™ on Stack Overflow

Angular JS Json data

2 Answers 2

1 Comment

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Related