JSONArray JSP Ajax Jquery

Question

EDIT:

Can I produce JSON as: "headers":[ "ID", "Organization Name", "Submission Date", "Status" ] instead of "headers":{"Status":"","Submission Date":"","Organization Name":"","ID":""} using JsonArray/JsonObject?

Original question:

I'm trying to create a JSONArray in the controller and using it in jquery/ajax. But it doesn't work when I try to access the json in javascript. This is the JSON output (almost what I want except the header need to have only the key):

[{"menu":{"extra":"","role":"users","name":"Home","url":"google.com"}},{"organization":{"status":"locked","submitted":"03/11/2015","name":"ABC Company","id":"1"},"headers":{"Status":"","Submission Date":"","Organization Name":"","ID":""}},{"notificationList":{"createdId":"21","startTimestamp":"2015-05-12T18:30:28.237Z","active":"true","endTimestamp":"2015-05-13T12:30:30.237Z","id":1,"description":"One","createdTimestamp":"2015-05-12T18:15:28.237Z"}},{"data":{"createdId":"251","startTimestamp":"2015-05-26T19:30:28.237Z","active":"true","endTimestamp":"2015-06-13T11:30:30.237Z","id":"102","description":"Notification 2","createdTimestamp":"2015-05-14T16:15:28.237Z"},"notificationHeaders":{"End Time":"","End Date":"","Active":"","Start Time":"","ID":"","Start Date":"","Description":""}}]

Javascript - Here is where I'm missing:

mainmenu = (function () {
    var mainmenu = null;
    $.ajax({
        type: "GET",
        contentType: "application/json",
        url: "<%=aURL%>",
        dataType: "json",
        success: function (mainMenuJson) {
            alert(mainMenuJson.menu.url);
            mainmenu = mainMenuJson;
        }
    });
    return mainmenu;
})();

It errors out here - undefined.

alert(mainMenuJson.menu.url);

alert (mainMenuJson) prints :

[object Object],[object Object],[object Object],[object Object]

And when I try to parse the JSON using:

var content= JSON.parse(mainMenuJson);

I get a parse error at line 1 column2

Once this works, also i need to render the whole page using javascript by making use of the mainmenu variable. Something like this:

var nheaders = mainmenu.notificationHeaders;
for(var i=0; i<nheaders.length; i++ ){
    var notificationTableTheadTh = document.createElement("th");
    notificationTableTheadTh.innerHTML = nheaders[i];
    notificationTableTheadTh.setAttribute('scope',"column");
    notificationTableTheadTr.appendChild(notificationTableTheadTh);
}
....
....
....

lshettyl · Accepted Answer · 2015-06-01 17:39:28Z

1

It's a JSON array, so you need:

mainMenuJson[0].menu.url // <--- google.com

Edit:

And your code could be re-written as the following.

function getMenu() {
    return $.ajax({
        type: "GET",
        contentType: "application/json",
        url: "<%=aURL%>",
        dataType: "json"
    })
}

getMenu().done(function(json) {
    var nheaders;
    //Looping as you may not know the position of the key in your JSON. If you did, then it'd be simply --> var nheaders = json[3]["notificationHeaders"];
    json.forEach(function(val, key) {
        if (val.hasOwnProperty("notificationHeaders")) {
            nheaders = val.notificationHeaders;
            for (var nKey in nheaders) {
                //Do stuff
                alert ("Key: " + nKey + " and Value: " + nheaders[nKey]);
                //Use jQuery for the below code chunk as well.
                //var notificationTableTheadTh = document.createElement("th");
                //notificationTableTheadTh.innerHTML = nheaders[i];
                //notificationTableTheadTh.setAttribute('scope',"column");
                //notificationTableTheadTr.appendChild(notificationTableTheadTh);         
            }
        }
    });
});

Hope that helps.

edited Jun 1, 2015 at 17:39

answered Jun 1, 2015 at 17:10

lshettyl

8,1815 gold badges27 silver badges31 bronze badges

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

4 Comments

Harry Over a year ago

wow! i thought it was something simple...I was using [i] for menu. Thanks so much. Will mark as answered after some more testing!

Harry Over a year ago

Quick question: alert(mainMenuJson[0].menu.url); works. But now if i try alert(mainMenuJson[0].organization.name) I get a javascript error that organization is undefined. What am i missing? - Got it use [1]

Harry Over a year ago

One more question Anyway to produce Json as: "headers":[ "ID", "Organization Name", "Submission Date", "Status" ] instead of "headers":{"Status":"","Submission Date":"","Organization Name":"","ID":""} using JsonArray/JsonObject?

lshettyl Over a year ago

Sure, in JS/jQuery or server side? if server side, what prog language/framework?

Collectives™ on Stack Overflow

JSONArray JSP Ajax Jquery

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related