pass collection of objects through http post in angular js

Question

I have pass a collection of objects through http post in angular js.

The code is as follows:

  $scope.selectedContent = function () {       
        var contents = $filter('filter')($scope.data.ContentId, { Selected: true });  // I could able to get all the selected objects here, No problem with it        
        var jsonData = angular.toJson(contents); //It is not able to convert to Json if there are more than 5 records
        var promise = $http.post('/webapi/cmsApi/CmsPublishApprovedContent?jsonData=' + jsonData, {});
        promise.success(function () {            
            window.location.reload();
        });



        [ReferrerFilterAttribute]
        [HttpPost]
        [System.Web.Http.ActionName("CmsPublishApprovedContent")]
        public void CmsPublishApprovedContent(string jsonData)
        {
            var contents = JsonConvert.DeserializeObject<List<ContentNodeInWorkFlow>>(jsonData);

            foreach (var content in contents)
            {
                _contentService.PublishContent(content.ContentId,  userId);
            }       
        }
    }

The above code works fine if there are 5 records or less. If there are more records, I could able to get all the selected record objects in the variable 'contents'. But the problem is occuring when converting to Json for all those objects. I have about 500 records to pass through. How can do I it?

There is no specific reason to convert to JSON data. I just need to extract the ids of all the selected items. I have modified the above code as below:

$scope.selectedContent = function () {        
        var contents = $filter('filter')($scope.data, { Selected: true });
        var abc = [];
        angular.forEach(contents, function(content)
        {
            abc.push(content.ContentId); // got all the ids in the array now
        });

        var promise = $http.post('/webapi/cmsApi/CmsPublishApprovedContent' ,{contents : abc});
        promise.success(function () {
            window.location.reload();
        });
    }

I have just took an array and pushed all the content ids into it. I could able to see all the ids in the array now. I tried to pass the array as above. How to retrieve those array in the code behind.

[ReferrerFilterAttribute]
        [HttpPost]
        [System.Web.Http.ActionName("CmsPublishApprovedContent")]
        public void CmsPublishApprovedContent(int[] abc)
        {}

I do not see any values obtained under int[] abc. What will be the datatype for the parameter in the method call above.

//It is not able to convert to Json if there are more than 5 records. This sounds extremely weird. What is the error? — Simone Zandara, Nov 24 '15 at 12:59
Additionally passing jsonData as a string is best avoided - both WEBAPI/MVC can handle json so you should change signature to CmsPublishApprovedContent(List contents) and let framework do the dirty work for you. — Ondrej Svejdar, Nov 24 '15 at 13:34

score 1 · Answer 1 · answered Nov 24 '15 at 12:53

1

You need second argument of $http.post method. You have to send such data by POST requests, not in query of url. You can put some data into body of the post request.

You need this:

var postBodyWithHugeAmountOFData = {data: [1,2,3,4,5...500]};
$http.post(url, postBodyWithHugeAmountOFData).success(function () {});

Also, you must be ready to handle this request in your backend.

answered Nov 24 '15 at 12:53

Sharikov Vladislav

7,049
9
50
87

I tried to do the process as you mentioned. Thought I see all the values in the array before posted, but I could not see those values when retrieved. I am using int array as the parameter to get all those values. But I don't see any values, it's just null in there. I have added the code in the post above. – Rama Nov 24 '15 at 14:10
I don't know anything about ASP.NET mvc. You can look about it [there](http://stackoverflow.com/q/13041808/2898694). Your question was about how to send send huge amount of data through http using AngularJS and I answered this question. – Sharikov Vladislav Nov 24 '15 at 16:22

score 0 · Answer 2 · answered Nov 24 '15 at 12:52

0

is there any specific reason u want to pass this data as a JSON?.

if u r using Web API in that case u can pass the object as it is but only make sure that collection in web API method contains all the property in javascript collection

answered Nov 24 '15 at 12:52

Sagar Kalokhe

64
7

score 0 · Answer 3 · answered Nov 24 '15 at 15:13

Thank you for all your posts. It's working fine without converting to Json. The code is as below.

$scope.selectedContent = function () {        
        var contents = $filter('filter')($scope.data, { Selected: true });
        var promise = $http.post('/webapi/cmsApi/CmsPublishApprovedContent' ,contents);
        promise.success(function () {
            window.location.reload();
        });
    }

and the signature would be

public void CmsPublishApprovedContent(List<ContentNodeInWorkFlow> abc)
        {
}

pass collection of objects through http post in angular js

3 Answers3