How to pass array as parameter to $http.get in Angularjs

Question

Problem Statement

I have a javascript array which i want to pass as a parmeter to $http.get in AngularJs. This array will be passed to action method in MVC. what should be the syntax? Please Help me. I am stuck here. The array being passed is javascript array

Angular Directive

$scope.selectedIdArray = [];   
$scope.selectedIdArray.push({ id: $scope.selectedId })

$scope.$parent.getProjects($scope.selectedIdArray);

Angular Controller

$scope.getProjects = function (selectedIdArray) {
        $http.get('Home/GetAllProjects', { params: { "parentId[]": selectedIdArray } })
            .then(function (data) {
                    $scope.projects = [];
            angular.forEach(data.data, function (value, index) {
                $scope.projects.push({ id: value.N_LevelID, label: value.T_LevelName }
                );
            });
            })
        .catch(function (data) {
            console.error('Gists error', data.status, data.data);
        })
    }

MVC Controller Action Method

public JsonResult GetAllProjects(int?[] parentId = null)
        {
            iMetricsEntities dbcontext = new iMetricsEntities();
            JsonResult jr = new JsonResult();
            if (parentId == null)
            {
                jr.Data = dbcontext.Levels.Where(objelevel => objelevel.N_LevelTypeID == 2 && objelevel.B_Active);
                jr.JsonRequestBehavior = JsonRequestBehavior.AllowGet;

                //return new JsonResult
                //{
                //    Data = dbcontext.Levels.Where(objelevel => objelevel.N_LevelTypeID == 2 && objelevel.B_Active),
                //    JsonRequestBehavior = JsonRequestBehavior.AllowGet
                //};
            }
            else if (parentId != null)
            {
                foreach (var id in parentId)
                {
                    jr.Data = dbcontext.Levels.Where(objelevel => objelevel.N_LevelTypeID == 2 && objelevel.B_Active && objelevel.N_ParentID == id);
                    jr.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
                }
            }

            return jr;
        }

Rafael Dowling Goodman · Accepted Answer · 2016-05-13 14:38:56Z

4

If you define your controller action like this:

    public JsonResult GetAllProjects(int[] parentId)
    {
        // Stuff goes here
    }

You can call it like this:

    $http.get('Home/GetAllProjects', { params: { "parentId": [1, 2, 3, 42] } })
    .then(function(response) {
        // stuff goes here
    });

The reason this works is because query strings can be specified multiple times. Both $http and MVC interpret these as arrays.

In the above example, this is the URL that gets generated by $http, which the controller action model binds to an array:

http://localhost:56976/Home/GetAllProjects?parentId=1&parentId=2&parentId=3&parentId=42

answered May 13, 2016 at 14:38

Rafael Dowling Goodman

9132 gold badges8 silver badges13 bronze badges

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

1 Comment

Matstar Over a year ago

If using Web API, add [FromUri] to the controller action parameter, otherwise you get binding errors.

shiv · Accepted Answer · 2016-05-13 14:06:45Z

1

$http(
  method: 'GET',
  url: ''Home/GetAllProjects'',
  params: {
    parentId: JSON.stringify(selectedIdArray )
  }
)

edited May 13, 2016 at 14:06

answered May 13, 2016 at 13:43

shiv

3931 gold badge5 silver badges18 bronze badges

5 Comments

Navin Rane Over a year ago

Hey Shiv , I am still getting null object in my MVC contrller method.

shiv Over a year ago

Hi, I have made a small edit. Previously I had set the param key to id now I have changed it to parentId. Did you try this ?

Navin Rane Over a year ago

Thanks shiv , it worked.. Great ... but i am getting string as "[{\"id\":162},{\"id\":194}]" i need to parse this as i want get data based on 162 and 194 , how this can be done in c#

shiv Over a year ago

Use a regular expression that will extract the numbers out of your string.

Navin Rane Over a year ago

"[{\"id\":162},{\"id\":194},{\"id\":295}]" i have this kind of string , using char array its making code complex , i want to extract these integers and need to put them in an array.

Collectives™ on Stack Overflow

How to pass array as parameter to $http.get in Angularjs

Problem Statement

Angular Directive

Angular Controller

MVC Controller Action Method

2 Answers 2

1 Comment

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

Problem Statement

Angular Directive

Angular Controller

MVC Controller Action Method

2 Answers 2

1 Comment

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related