how do i iterate a returning json string

i managed to return a JSON string like this

[ [ [ { "roleId": 2, "name": "normalUser", "description": "this is a descprtion", "type": "T", "state": "A", "permList": [ ] }, { "roleId": 1, "name": "admin", "description": "this is a descprtion", "type": "T", "state": "A", "permList": [ ] } ], { "permId": 2, "name": "this is a name", "description": "this is a descprtion" } ]

when i print this response in my javascript in prints this:

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

i'm using jquery and this is my code so far when i'm trying to get access to the data inside my returning JSON:

function searData() { var idPerm= $('select[name=SelectPerm]').val(); var json = {"idPerm": idPerm}; $.ajax( { type: "POST", url: "deletePerm/loadSelect", data: JSON.stringify(json), contentType: "application/json; charset=utf-8", dataType: "json", cache: false, beforeSend: function (xhr) { xhr.setRequestHeader("Accept", "application/json"); xhr.setRequestHeader("Content-Type", "application/json"); }, success: function (data) { console.log('the JSON have : ' + data ); alert(JSON.stringify(data)); $.map ( data.perm, function (perm) { console.log( 'inside the map perm id value is: ' + perm.idPerm); console.log( 'inside the map perm id value is: ' + perm.name); }); }, error: function (xhr, ajaxOptions, thrownError) { alert(xhr.status); alert(xhr.responseText); alert(thrownError); } }); }

but it give's me this error

Uncaught TypeError: Cannot read property 'length' of undefined

inside my JSON are the first object is a POJO Perm object, the other object is an ArrayList<Roles> this list contains two (2) roles, but o dont know why is printing [object Object],[object Object],[object Object] is there are 2 objects in my json 3 in total if you count the two objects that contains the list but the whole list shouldn't be one (1) object or json counts all the objects in the list separately,

my question is how should i iterate over this json to get the values inside.

Printing where? And how? From Java? Or JavaScript?

i want to print them using console.log(), in the javascript function searData() i posted, also all the text and errors i said where printed in my javascript function using console.log(), i whatched those errors in my chrome console and i used those console.log() to debug my code and see what's wrong with it, i wanted firts to print the values of my returning json in my javascript to later use them properly

The this has nothing to do with Java at all? I've moved it to the HTML/JavaScript forum.

console.log() is a diagnostic tool, not a print engine. Different dev tools will represent objects in different ways. Why are you concerned with exactly what it prints out?

In many dev tools, you can expand the object to see its contents. You can also type in expressions at break points to see what variables and objects contain.

How are you creating the JSON? Please post the servlet code that constructs and returns the JSON, or if you have a separate object that constructs it for the servlet, post that.

First, the JSON string you posted isn't valid JSON. So it's not surprising that you're getting errors when trying to work with it. Send it through a validator such as http://jsonlint.com/ for clues about what's invalid.

Looks like it might be as simple as missing a closing "]". But then, you have an array with two elements. The first element is another array that contains two objects. The second element is an object. Are you sure this is the structure you want?

You mentioned the Chrome console. Another part of the Chrome dev tools useful for this kind of debugging is the Network tab. There should be a list of the page's requests, including your Ajax request. If you don't see tabs for the response to this request, click on the request URL to display them. The Response tab will give you the response as a text string, and the Preview tab will give you an expandable object that you can drill into to check values and structure (as long as the JSON is valid, I would presume).

this is the method where i create the JSON

private String mapTwoObjectsToJSON( Perm perm, ArrayList<Role> roleList) { ObjectMapper mapper = new ObjectMapper(); try { String roleListData= mapper.writeValueAsString(roleList); String permData= mapper.writeValueAsString(perm); String JsonResponse= "[" + permData+ "," + roleListData+ "]"; System.out.println("respuesta JSON tiene: " + JsonResponse); return JsonResponse; } catch (JsonProcessingException e) { e.printStackTrace(); return null; } }

here is the controller i'm using Spring MVC:

@RequestMapping(value = "deletePerm/loadSelect", method = RequestMethod.POST) public @ResponseBody String deletePerm(@RequestBody final String json, Model model) throws IOException { ObjectMapper mapper = new ObjectMapper(); Perm permMapped= mapper.readValue(json, Perm.class); ArrayList<Role> roleList; Perm perm; perm = permDAO.searchById(permMapped.getIdPerm()); roleList= permDAO.searchRoleListByPermId(permMapped.getIdPerm()); String jsonResponse = mapTwoObjectsToJSON(perm, roleList); return jsonResponse; }

you where right the json was not valid here is my json after your opinion
[ [ [ { "roleId": 2, "name": "normalUser", "description": "this is a descprtion", "type": "T", "state": "A", "permList": [] }, { "roleId": 1, "name": "admin", "description": "this is a descprtion", "type": "T", "state": "A", "permList": [] } ], { "permId": 2, "name": "this is a name", "description": "this is a descprtion" } ] ]


here is what i have tried so far:

success: function (data) { console.log( data[0].permId); console.log( data[0].name); console.log( data[0].description); for (var i = 1; i < data.length; i++) { for (var k = 0; k < data[ i ].length; k++) { console.log( data[ i ] [ k ].roleId); console.log( data[ i ] [ k ].name); console.log( data[ i ] [ k ].description); console.log( data[ i ] [ k ].type); console.log( data[ i ] [ k ].state); if (data[ i ] [ k ].permList!== null) { for (var u = 0; u < data[ i ] [ k ].permList.length; u++) { console.log(data[ i ] [ k ].permList[ u ].permId); console.log( data[ i ] [ k ].permList[ u ].name); } } } } },

So far i had managed to print the firts object that is the Perm Pojo object, and also i'm able to print some fields of the objects that are inside the ArrayList<Role> like name,description,type and state, but i'm having troubles when i try to print the permList list inside my Role object that is inside the ArrayList<Role>, it says this

Cannot read property 'name' of undefined

in this line

console.log('perm list : ' + data[ i ] [ k ].permList[0].name);

also if i try to see the lenght of the list like this

console.log('perm list : ' + data[ i ] [ k ].permList[0].lenght);

it prints that the lenght is 0

here is my Role class

public class Role { private int roleId; private String name; private String description; private String type; private String state; private ArrayList<Perm> permList; }

and my Perm Class

public class Perm{ private int permId; private String name; private String description; }

i dont pass the DAO methos since they are already teste and they work fine i have debugged them and they return the data fine, when i call the roleList= permDAO.searchRoleListByPermId(permMapped.getIdPerm()); in my controller class, the roleList have roles with their respective permList with the correct data, the permList is not empty, the permList is full with tehir respective perms.

You still have not answered the question as to why you are doing this in the first place. What's wrong with using the console as intended?

P.S. And you are aware of console.dir(), right?

Bear Bibeault wrote:You still have not answered the question as to why you are doing this in the first place. What's wrong with using the console as intended?

i'm not aware of console.dir()

and what do you mean when you say: "why you are doing this in the firts place"?? how are you suppose to use the console as intended?


i don't know if this answer your question, but i'm doing this because i'm creating a delete permision page, and in this page there's a select when you select the permision and when you do this, it loads the information of the perms in some html labels, also i need to load a select with the roles in the systme that have that permission, that's why i retun in the json a list of Roles, but i'm having torubles when i tried to get the field permList in the Roles objects inside the list.

OK, but what has that to do with trying to change what console.log() outputs?

The first thing to do is to fix your JSON. As already pointed out, it makes no sense to have nested lists the way you have.

Also, are you generating the JSON by hand? If so, don't. Let one of the established and debugged JSON libraries generate valid JSON for you.

Bear Bibeault wrote:OK, but what has that to do with trying to change what console.log() outputs?

The first thing to do is to fix your JSON. As already pointed out, it makes no sense to have nested lists the way you have.

Also, are you generating the JSON by hand? If so, don't. Let one of the established and debugged JSON libraries generate valid JSON for you.

1) i'm not rying to change anything that the console.log() outputs hahaha where did you get that idea??

2) i'm using jackson to generate my JSON, and why do you say that my list don't hve any sense?


3) i checked again and it was my fault sry for wasting your time friend it was my DAO method that was returning the roles without their permlists, sorry friend, but i'm still having prolbems when i do this :

data[ i ] [ k ].permList.length in the second for it says "undefined" it looks like it's trying to find a property in my class named lenght, and i think it's not looking for the function "lenght" persee, but my big question is how this works in the third 3 "for" since it loop the permList fine?




i'm talking about this "for"

this .lenght works

for (var u = 0; u < data[ i ] [ k ].permList.length; u++) { console.log(data[ i ] [ k ].permList[ u ].permId); console.log( data[ i ] [ k ].permList[ u ].name); }

but this .lenght dont work

for (var k = 0; k < data[ i ].length; k++) { console.log( data[ i ] [ k ].roleId); console.log( data[ i ] [ k ].name); console.log( data[ i ] [ k ].description); console.log( data[ i ] [ k ].type); console.log( data[ i ] [ k ].state); console.log( data[ i ] [ k ].permList.length )

here is the whole loop
console.log( data[0].permId); console.log( data[0].name); console.log( data[0].description); for (var i = 1; i < data.length; i++) { for (var k = 0; k < data[ i ].length; k++) { console.log( data[ i ] [ k ].roleId); console.log( data[ i ] [ k ].name); console.log( data[ i ] [ k ].description); console.log( data[ i ] [ k ].type); console.log( data[ i ] [ k ].state); if (data[ i ] [ k ].permList!== null) { for (var u = 0; u < data[ i ] [ k ].permList.length; u++) { console.log(data[ i ] [ k ].permList[ u ].permId); console.log( data[ i ] [ k ].permList[ u ].name); } } } }

It appears that in addition to writing the code that consumes the response, you're also writing the code that processes the request and formats the response. This is a luxurious position to be in -- you get to craft the two to work together exactly as you see fit. So from my standpoint, why are you outputting the data in such an odd format, which is causing you to write torturous, error-prone code with all those i's and k's and u's?

You want to populate two lists with stuff, right? Make it easy on yourself. At the highest level, have two named variables each which point to an array of objects containing your stuff. Then all you initial traversal (and null-checking) of the structure is by named fields.

{ "dataForFirstSelect": [ { "field1": "value1", "field2": "value2", "list": [ { "deepField1": "deepValue1", "deepField2": "deepValue2" }, { "deepField1": "deepValue1", "deepField2": "deepValue2" } ] }, { "field1": "valueA", "field2": "valueB", "list": [ { "deepField1": "deepValue1", "deepField2": "deepValue2" } ] } ], "dataForSecondSelect": [ { "field4": "valueA3", "field5": "valueB2", "field6": "valueC9" } ] }

Better, I hope?

Edited to add: And if those inner lists are just strings or some other primitives and not objects, things are even simpler:

<...> "list": [ "deepValue1", "deepValue2" ] <...>

Michael Matola wrote:It appears that in addition to writing the code that consumes the response, you're also writing the code that processes the request and formats the response. This is a luxurious position to be in -- you get to craft the two to work together exactly as you see fit. So from my standpoint, why are you outputting the data in such an odd format, which is causing you to write torturous, error-prone code with all those i's and k's and u's?

You want to populate two lists with stuff, right? Make it easy on yourself. At the highest level, have two named variables each which point to an array of objects containing your stuff. Then all you initial traversal (and null-checking) of the structure is by named fields.

{ "dataForFirstSelect": [ { "field1": "value1", "field2": "value2", "list": [ { "deepField1": "deepValue1", "deepField2": "deepValue2" }, { "deepField1": "deepValue1", "deepField2": "deepValue2" } ] }, { "field1": "valueA", "field2": "valueB", "list": [ { "deepField1": "deepValue1", "deepField2": "deepValue2" } ] } ], "dataForSecondSelect": [ { "field4": "valueA3", "field5": "valueB2", "field6": "valueC9" } ] }

Better, I hope?

hi friend that looks more clean hehe, but since i'm not creating the JSON by hand, i'm using JACKSON and using this way to create the JSON

String roleListData= mapper.writeValueAsString(roleList); String permData= mapper.writeValueAsString(perm); String JsonResponse= "[" + permData+ "," + roleListData+ "]";

i map the two objects using that function "writeValueAsString" and then i concat them in a final string "String JsonResponse= "[" + permData+ "," + roleListData+ "]" , i would like to doit like you post in that example but how can i create a JSON like that using JACKSON and not making it by hand?