Creating JSON string in AngularJS

Question

I want to create a JSON string in the following format as below using AngularJS:

{
    "userid": 100,
    "fleetid": 506,
    "comments": "This is a test comment",
    "fleetcheckdate": "29/10/1976",
    "options": [{
        "fleetcheckid": "1",
        "fleetcheckvalueid": "1"
    }, {
        "fleetcheckid": "2",
        "fleetcheckvalueid": "1"
    }, {
        "fleetcheckid": "3",
        "fleetcheckvalueid": "1"
    }]
}

Where

"userid"
"fleetid"
"comments"
"fleetcheckdate"

are all separate values know to me.

For "options" I have a multi-dimensional array that stores the values for "fleetcheckid" and "fleetcheckvalueid" that I create as follows:

$scope.selectedRadioArray = [];

$scope.doSomething = function(fleetCheckItemID, fleetCheckID)
{
    $scope.selectedIDS = [fleetCheckItemID, fleetCheckID];
    $scope.selectedRadioArray.push($scope.selectedIDS);
    console.log("Array: " + $scope.selectedRadioArray); // Prints e.g. 4,3,8,6,34,8
}

The doSomething() method is fired each time the user interacts with a button and this generates the 2 values "fleetcheckid" and "fleetcheckvalueid". In the example above the user has clicked the button 3 times. The button can be clicked any number of times.

How do I convert the information above into a JSON string as per the example that I can send to my Database via a $http.post()?

@SSH JSON is a [...] data format. So you can't have a JSON object. You can have a string, which contains data in JSON format (a JSON string), or just a JavaScript object. — Michał Perłakowski
– Michał Perłakowski, Commented May 6, 2016 at 14:12

Kyle · Accepted Answer · 2016-05-06 14:15:22Z

1

When sending information to the server via $http, it's generally a good idea to use JSON. Don't convert it to a string.

Simply format your payload like this:

var payload = {
    userId: $scope.userId,
    /* etc.... */
    options: $scope.optionsArray
};

Then, when sending to the server, do this:

$http.post('path/to/api', payload, { headers: { /* etc... */ }}).then(successCallback).catch(errorCallback);

answered May 6, 2016 at 14:15

Kyle

5,6077 gold badges38 silver badges48 bronze badges

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

1 Comment

heyred Over a year ago

To translate your example to mine, how do I actually add the array of items in my $scope.selectedRadioArray to my "options": [{...]} values? I cant put a forEach() loop in the var payload = variable?

Paulo Galdo Sandoval · Accepted Answer · 2016-05-06 14:05:55Z

0

you can use in the $http someething like this

$http({
        url: uri,
        method: 'post',
        data: angular.toJson(categoria),
        headers: {
            'Authorization': 'Bearer ' + token.data.access_token,
            'Content-type': 'application/json'
        }
    }).then(function successCallback(response) {
        datosRecu = response;
        deferred.resolve(datosRecu);
    }, function errorCallback(response) {
        datosRecu = response;
        deferred.resolve(datosRecu);
    });

in this case `angularToJson` convert it on a JSON and send it in the body

answered May 6, 2016 at 14:05

Paulo Galdo Sandoval

2,2036 gold badges30 silver badges44 bronze badges

2 Comments

heyred Over a year ago

How do I create the categoria in your example though is my question to pass to angular.toJson()?

Paulo Galdo Sandoval Over a year ago

it's a normal object that you pass through parameter in my case would be $promise= service.add(categoria); that categoria is received by the $http and used it in angularToJson

Collectives™ on Stack Overflow

Creating JSON string in AngularJS

2 Answers 2

1 Comment

2 Comments

Hot Network Questions