get json array objects in javascript

Question

Hi how to get json array elements in different ids in response?

//server side jsp

 <%@page import="net.sf.json.JSONObject"%>
<%@page import="net.sf.json.JSONArray"%>
<%
  JSONArray arrayObj=new JSONArray();               
 JSONObject obj=new JSONObject();
 obj.put("name","data");// how can i display string "name" in secondcombobox id?
 obj.put("roll_no","data"); how can i display string "roll_no" in thirdcombobox id?
 out.println(obj.toString());
%>

client side jsp where retrieving json array elements in javascript

 $("#firstcombo").change(function() {
 $.get('comboboxpage.jsp', { combo1Val : $(this).val() }, function(responseData) {
 $("#secondcomboboxid").replaceWith(data.name);// here i want to display name, how can i do it?
 $("#thirdcomboboxid").replaceWith(data.roll_no);// here i want to display roll no, how can i do it?
});
});

<input type="text" id="secondcomboboxid" name="secondcomboboxid"/>// how can i show name here?
<input type="text" id="thirdcomboboxid" name="thirdcomboboxid"/> how can i show roll_no here?

How can i display name in secondcomboboxid and roll no in thirdcomboboxid? I googled a lot but could not find any solution, Any ideas please

post the json you are getting in the response from the server — Rafay
– Rafay, Commented Feb 9, 2012 at 6:19
Please post the full string value of responseData so I can be sure of it's format. — vinczemarton
– vinczemarton, Commented Feb 9, 2012 at 6:20
@3nigma i am getting no response from server side, how should i modify JSON Array objects to get response in client side? — Tom
– Tom, Commented Feb 9, 2012 at 6:23
@SoonDead full string value of responseData means? If i am writing out.println("somevalue"); in server side then i am getting "somevalue" in secondcombobox id and also in thirdcombobox id, which i want to separate, how should i modify my client and server side code? — Tom
– Tom, Commented Feb 9, 2012 at 6:25

Didier Ghys · Accepted Answer · 2012-02-09 06:30:34Z

2

If you are loading JSON data, you'd better use the method .getJSON() that will take care of parsing the response to a JSON object automatically.

Then you response data being an object, you can access its properties with the dot notation: data.name.

Special case thought for the second property "roll no". As there is a white space, you would have to use the array notation to access the value: data['roll no'].

$.getJSON('comboboxpage.jsp', { combo1Val : $(this).val() }, function(data) {
    $("#secondcomboboxid").replaceWith(data.name);
    $("#thirdcomboboxid").replaceWith(data['roll_no']);
});

More generally, as mentionned by @diEcho, to parse a json string, you can use $.parseJSON()

edited Feb 9, 2012 at 6:30

answered Feb 9, 2012 at 6:21

Didier Ghys

30.6k9 gold badges77 silver badges82 bronze badges

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

7 Comments

fncomp Over a year ago

Shouldn't that be: data['roll no'] or is there some change caused by arrayObj.add()?

Tom Over a year ago

thanks Didier for the answer but in server side JSON what modification should i do? i am getting no value in client side by on change event of first combo box.

Didier Ghys Over a year ago

I'm no familiar with JSP, but you can try following this example (first part, not the ajax part)

Didier Ghys Over a year ago

I guess if you're sending a pure array, you're going to end up with ['name', 'roll no'] and you'll have to use data[0] and data[1] to access the values.

Tom Over a year ago

JSONObject obj=new JSONObject(); obj.put("name","data"); obj.put("roll_no","data"); out.println(obj); like this?

|

Rafay · Accepted Answer · 2012-02-09 07:34:03Z

1

try this

<%
          JSONObject arrayObj= new JSONObject();

           arrayObj.put("name","john");
           arrayObj.put("roll no","007");


          response.setContentType("application/json");
          response.getWriter().write(arrayObj.toString());

%>

client side

$.ajax({
url:'comboboxpage.jsp',
dataType:'json',
type:'GET',
success:function(data){
console.log(data);
},
error:function(jxhr){
console.log(jxhr.responseText);
}

});

here is a helpful link

edited Feb 9, 2012 at 7:34

answered Feb 9, 2012 at 7:24

Rafay

31.1k5 gold badges71 silver badges106 bronze badges

2 Comments

Tom Over a year ago

thanks 3nigma, but i am still getting no response, any idea? have you tested it in your terminal?

Rafay Over a year ago

no i cant test it atm, see the answer update use $.ajax instead and make a error handler. are you sure the path to comboboxpage.jsp is correct, what does the firebug tells you, does it show status 200 ?

xkeshav · Accepted Answer · 2012-02-09 06:21:08Z

1

use

responseData.name
responseDate.roll_no

or use parseJSON

var obj = jQuery.parseJSON('{"name":"John"}');
alert( obj.name === "John" );

answered Feb 9, 2012 at 6:21

xkeshav

54.2k47 gold badges183 silver badges255 bronze badges

2 Comments

Tom Over a year ago

thanks diEcho for the answer but in server side JSON what modification should i do? i am getting no value in client side by on change event of first combo box.

xkeshav Over a year ago

I'm no familiar with JSP. but you must see the comment given by @Didier Ghys

fncomp · Accepted Answer · 2012-02-09 07:08:57Z

1

So, if I get your setup correctly, you're handling e.g., :8080 with some simple servlet and you want to give back JSON data via a jsp. I think this is not a great idea, but for prototyping, I suppose... Here's a possible just make it work:

<%  
    JSONArray arrayObj=new JSONArray();                       
    arrayObj.put("name");
    arrayObj.put("roll no");
    out.println(arrayObj.toString());
%>

See above for the front-end components.

answered Feb 9, 2012 at 7:08

fncomp

6,2084 gold badges36 silver badges43 bronze badges

1 Comment

Tom Over a year ago

ok for receiving data i should follow Didier Ghys's code right? but it is not displaying name/roll_no in second/third textbox, have a look at my updated question please

Collectives™ on Stack Overflow

get json array objects in javascript

4 Answers 4

7 Comments

2 Comments

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

7 Comments

2 Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related