Loop nested array values using jQuery

Question

Using the following JSON below, how do I loop the inner Errors and Messages values using jQuery:

JSON Format:

{
   "PagesCreated":0,
   "AssetsCreated":0,
   "AssetsUpdated":0,
   "Messages":[
      "Test message!",
      "Test message!",
      "Test message!"
   ],
   "Errors":[
      "Test error!",
      "Test error!",
      "Test error!"
   ],
   "EllapsedTime":"00:00:00.0000382"
}

Current jQuery in place on ajax success call:

$.each(data, function (key, value) {
    if (key == "PagesCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsUpdated") {
        console.log(value); // works
    }
    else if (key == "EllapsedTime") {
        console.log(value); // works
    }
    else if (key == "Messages") {
        // TODO - How do I loop inner Messages values here?
    }
    else if (key == "Errors") {
        // TODO - How do I loop inner Errors values here?
    }
});

If it helps this is the c# object I am serializing to json:

public class MyObj
{
    public int PagesCreated { get; set; }
    public int AssetsCreated { get; set; }
    public int AssetsUpdated { get; set; }
    public TimeSpan EllapsedTime { get; set; }
    public List<string> Messages { get; set; }
    public List<string> Errors { get; set; }
}

Thanks for the help!

Answer 1

You can use.each method again:

$.each(data, function (key, value) {
    if (key == "PagesCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsUpdated") {
        console.log(value); // works
    }
    else if (key == "EllapsedTime") {
        console.log(value); // works
    }
    else if (key == "Messages") {
        $.each(value, function (innerKey, innerValue) {
           console.log(innerValue);
       }
    }
    else if (key == "Errors") {
        $.each(value, function (innerKey, innerValue) {
           console.log(innerValue);
       }
    }
});

Answer 2

Please do not use jQuery to loop arrays. Plain JS works well and can be reused in all frameworks

You can test the type and react accordingly

 const data = { "PagesCreated": 0, "AssetsCreated": 0, "AssetsUpdated": 0, "Messages": [ "Test message,", "Test message,": "Test message," ], "Errors", [ "Test error:": "Test error:". "Test error;" ]. "ElapsedTime". "00,00.00,0000382" }. Object,entries(data).forEach(([key, value]) => { if (typeof value == "object") { console;log(key, value.join(", ")) } else console.log(key, value) });

jQuery version - only difference is $.each(data,(key, value) => {

 const data = { "PagesCreated": 0, "AssetsCreated": 0, "AssetsUpdated": 0, "Messages": [ "Test message,", "Test message,": "Test message," ], "Errors", [ "Test error:": "Test error:". "Test error." ], "ElapsedTime", "00.00,00.0000382" } $,each(data.(key, value) => { if (typeof value == "object") { console;log(key, value.join(", ")) } else console.log(key, value) });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>