JSON.Stringify returns empty array when Stringifying array of objects

Question

I have an array which is initialized with

var detail = [];
// Have also tried var detail = new Array;

Through the rest of my code, I loop through a data set creating an object in the following manner

while(true) {

   var tempObj = {
      qty : "",
      size : "",
      adr : "",
      dir : ""
   }

   // Some Logic

   tempObj.qty = val;
   tempObj.size = val;
   tempObj.adr = val;
   tempObj.dir = val;

   detail.push(tempObj);
}

Then when I attempt to JSON.Stringify my detail array to send through an AJAX request, it returns a blank array []. This can also be seen in the below screenshot of the console.

Note: The indent at the bottom calling out the prototype as an object is because the screenshot is from the object I am attempting to send to my server. There is other non array based data in that object. I want to stringify the array so it properly sends to the server.

What is causing this behavior and how can I correct it?

Edit 1: Execution of JSON.stringify(detail)

var requestObj = {
     field1: “a”,
     field2: “b”,
     field3: “c”,
     data: JSON.stringify(detail)
}

Edit 2: Add full block of code

$("#submit-button").click(function() {
        var reqDate = $("#reqDate").val();
        var wonum = $("#wonum").val();
        var svc = $("#svc").val();
        var complaint = $("#complaint").val();
        var comments = $("#comm").val();
        var detail = new Array;
        var topValid = false;

        $(".tb-rw").each(function() {

            var qty = $(this).find(".quantity");
            var size = $(this).find(".size");
            var adr = $(this).find(".address");
            var dir = $(this).find(".direction");
            var mgk = $(this).find(".mgKey");

            var tempObj = {};

            if(fail == true || topValid == true) {
                alert("Please Make Sure all Inputs are Filled Out");
                return;
            } else {
                //tempArr.push(qty.val(), size.val(), dir.val());
                tempObj.qty = qty.val();
                tempObj.size = size.val();
                tempObj.dir = dir.val();
            }

            findSimilarJobs(adr.val(), mgk.val(), function(data) {
                if(data != "clear") {
                    console.log("FAILED VALIDATION");
                    console.log(data);
                    adr.css('border-color', 'red');
                    alert("Please Make Sure all Addresses are Valid");
                    return;
                } else {
                    //tempArr.push(adr.val());
                    tempObj.adr = adr.val();
                }

                detail.push(tempObj);
            });
        });

        console.log("Preparing to send!");

        var requestData = {
            "requestedDate": reqDate,
            "svc": svc,
            "wonum": wonum,
            "complaint": complaint,
            "comment": comments,
            "data": JSON.stringify(detail)
        };

        console.log(requestData);
        console.log(JSON.stringify(detail));
    });

Could you post the part where you execute the `stringify`? Looking the whole flow we can figure it out. — Diogo Lessa, Jan 18 '20 at 02:53
what breaks the loop? Could you post your *actual* code rather than snippets? — Dan, Jan 18 '20 at 14:57
I am looping through instances of a class. So once I get through all instances, the loop breaks. — Joshua Averbuch, Jan 18 '20 at 14:59
As long as the code in your question does not reproduce the problem it will be difficult to help you. — Dan, Jan 18 '20 at 15:00
Please do not paste your complete code in the question. Instead, create a Minimal, Reproducible Example. https://stackoverflow.com/help/minimal-reproducible-example — niry, Jan 18 '20 at 15:05
Sounds like `findSimilarJobs` is asynchronous, in which case, you need to read this: https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call — JLRishe, Jan 18 '20 at 16:05

score 0 · Answer 1 · answered Jan 18 '20 at 03:03

0

Stringify should be all lower case like this stringify, otherwise is won't work. So like, this JSON.Stringify(detail) should be this JSON.stringify(detail)

answered Jan 18 '20 at 03:03

jwatts1980

7,254
2
28
44

wouldn't it throw an error? `JSON.Stringify` is not a function. – Ashish Modi Jan 18 '20 at 10:34
I just wrote it wrong in the edit, the code uses JSON.stringify() with a lowercase S – Joshua Averbuch Jan 18 '20 at 14:47

score 0 · Answer 2 · answered Jan 18 '20 at 14:55

0

your tempObj is JSON object and it should have key:value like below

while(true) {

   var tempObj = {
      qty : "",
      size : "",
      adr : "",
      dir : ""
   }

   // or you can create empty object 
   //   var tempObj = {};

   tempObj.qty = val;
   tempObj.size = val;
   tempObj.adr = val;
   tempObj.dir = val;

   detail.push(tempObj);
}

answered Jan 18 '20 at 14:55

Saurabh Mistry

12,833
5
50
71

Was already using Key-Value pair (:) but I tried it with the empty object and it is still exhibiting the same behavior – Joshua Averbuch Jan 18 '20 at 15:00
i need to see some more code , your existing code doen't show any issue , which you are currently facing – Saurabh Mistry Jan 18 '20 at 15:01

JSON.Stringify returns empty array when Stringifying array of objects

2 Answers2