building JSON string in angular from form

Question

currently i have an api in which you send a json and the api response: the json i send: { "instructions": [ { "A": 9, "B": 1, "move": "moveonto" }, { "A": 8, "B": 1, "move": "moveover" } ], "length": 20, "res": "null" }

and the api response: { "instructions": [ { "A": 9, "B": 1, "move": "moveonto" }, { "A": 8, "B": 1, "move": "moveover" } ], "length": 20, "res": "Position [0] : 0Position [1] : 1 9 8Position [2] : 2Position [3] : 3Position [4] : 4Position [5] : 5Position [6] : 6Position [7] : 7Position [8] : Position [9] : Position [10] : 10Position [11] : 11Position [12] : 12Position [13] : 13Position [14] : 14Position [15] : 15Position [16] : 16Position [17] : 17Position [18] : 18Position [19] : 19" }

im developing a very basic webpage: when i click on the send to the server button i need to send it, the problem is i dont know how to build the json, can you help me? thx

i have slight idea:

Json = {
  "instructions": [{
    "A": $scope.addA,
    "B": $scope.addB,
    "move": $scope.addMov
  }, {
    "A": $scope.addA,
    "B": $scope.addB,
    "move": $scope.addMov
  }],
  "length": $scope.blockLength,
  "res": null
};

and i send it :

$http.post("http://localhost:56493/api/BlocksProblem", Json)
  .then(function (data) {
    $scope.result = data;
  }, function (response) {
    $scope.result = response;
  });

thank you very much for your time reading through all of it.

score 0 · Answer 1 · answered Feb 16 '17 at 19:38

You dont necessarily "build" the json in the typical sense. By sending object data, angularjs with convert it to json for you.

for example. If i have a javascript variable like this:

var J = {A:1, B:2}

and send it as data in an http post, the json would look like: {"A":"1","B":"2"}

Without seeing anything of what your server architecture looks like, you could do something like this

 $scope.SendJson = function (Callback) {

    $http({
        url: YOURURL,
        method: 'POST',
        dataType: 'json',
        data: {
          "instructions": [
                 {"A": $scope.addA,"B": $scope.addB,"move": $scope.addMov}, 
                 {"A": $scope.addA,"B": $scope.addB,"move": $scope.addMov}],
          "length": $scope.blockLength,
          "res": null}
     })
     .then(function (data) {
               $scope.result = data;
            }, function (response) {
                 $scope.result = response;
            });

    })

Also, you dont need to quote the key value. Its implicit

With all that said, verify that the packet is constructed correctly in your developer tools.

score 0 · Answer 2 · edited May 23 '17 at 12:34

reading through stackoverflow i found this:

How do I create JavaScript array (JSON format) dynamically?

so i build mine with:

    //here i save the values of A,B and the moves, that i get from the form 
    var serverMove = [];
    var serverA = [];
    var serverB = [];
    //create the json 
    var jsonS = {
          instructions: [],
          "length": $scope.blockLength,
          "res": ""
    };
       //dynamically  fill only the instrucions array part 
        for (var i = 0; i < serverA.length; i++) {
          jsonS.instructions.push({
            "A": serverA[i],
            "B": serverB[i],
            "move": serverMove[i]
          })
        }

the result json is something like :

{ 
    "instructions": [
        { 
            "A": 1
            , "B": 3,
            "move": 
            "moveonto" 
        },
        { 
            "A": 5,
            "B": 9, 
            "move": "pileover" 
        } 
        ], 
        "length": 22, 
        "res": "" 
}

i hope someone finds it useful

building JSON string in angular from form

2 Answers2