how to get JSON objects from servlet?

Question

I am making a simple html servlet program where I need get JSON object from the servlet, and in html I am able to get the data, but how can i refer to each attribute?

Here is the servlet get method

    PrintWriter out=response.getWriter();
    StringBuffer emps = new StringBuffer("{employees:[");
    emps.append("{fullname:\"Abhishek Raj Simon\"},{email:\"[email protected]\"}]");
    emps.append("}");
    out.println(emps);

JS to send

function getJson()
{
 var url_action="/temp/jsontest";
 var form=document.forms["mainForm"];
 var splitOutput;
 var client; 
 var dataString;

 if (window.XMLHttpRequest){ 
     client=new XMLHttpRequest();
 } else {
     client=new ActiveXObject("Microsoft.XMLHTTP");
 }

 client.onreadystatechange=function(){
     if(client.readyState==4&&client.status==200)
     {
        var res=client.responseText;
        alert(res);     
        alert(client.responseText.employees.fullname); //DOES NOT WORK
        alert(client.responseText.employees.email); //DOES NOT WORK     
     }
 };

 client.open("GET",url_action,true);
 client.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 client.send();

and a simple form

<form>
    <input type="button" value="get me some json" onclick="getJson();">
</form>

When i click on the button, i get only 1 alert displaying
{employees:[{fullname:"Abhishek Raj Simon"},{email:"[email protected]"}]} How can i fetch Abhishek Raj Simon and [email protected] using fullname and email respectively?

Edited after reading post from Artem

my servlet

    Gson gson = new Gson( );
    List<Employee> employees = new ArrayList<Employee>();
    Employee emp=new Employee();
    emp.setFullname("Abhishek Raj Simon");
    emp.setEmail("[email protected]");
    employees.add(emp);
    response.setContentType( "application/json");
    out.println( gson.toJson( employees));

js part

var res=eval('(' + client.responseText + ')');
        alert(res);     
        alert(res.employees.fullname);
        alert(res.employees.email);

marc_s · Accepted Answer · 2016-02-05 08:13:19Z

3

I think you should slightly change the JSON that you send form the servlet: {employees:[{fullname:"Abhishek Raj Simon", email:"[email protected]"}]} would work a bit better in that context.

I'd recommend jQuery as pap has also advised. The code would be:

$.getJSON('/temp/jsontest', function(data) {
   var items = [];
   for (employee in data.employees) {
       items.push(employee.fullname + '<' + employee.email + '>');
   }
   alert('Employees: ' + items.join(', '));
});

In my opinion it is lot simpler and easier to understand than dealing with raw XHR. The jQuery $.getJSON will do GET for you, and then evaluate the JSON response so the function is presented with nice JSON representation of your data that is easy to manipulate.

EDIT:

After interesting discussion here is some more improvement you could introduce in order to replace the low-level code with proper JQuery-based implementation.

<script>
  $(document).ready(function() {
    $("#json-button").click(function() {
      $.getJSON('/temp/jsontest', function(data) {
        var items = [];
          for (employee in data.employees) {
            items.push(employee.fullname + '<' + employee.email + '>');
          }
          alert('Employees: ' + items.join(', '));
      });
    });
  });
</script>

<form>
    <input id="json-button" type="button" value="get me some json">
</form>

edited Feb 5, 2016 at 8:13

marc_s

760k186 gold badges1.4k silver badges1.5k bronze badges

answered May 27, 2011 at 9:08

Tomasz Blachowicz

5,8619 gold badges44 silver badges48 bronze badges

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

6 Comments

AabinGunz Over a year ago

@Tomasz: In my case the getJson() method is fixed for sending sending request. so how can i still get back the request as JSON Object?

Tomasz Blachowicz Over a year ago

What do you mean by saying getJson() is fixed for sending request? It cant be replaced? Why?

AabinGunz Over a year ago

i am not allowed to use any external library

Tomasz Blachowicz Over a year ago

OK. I must say I'm confused. Why you are not allowed to use tools like jQuery that significantly improve your code? you could implement new function getJsonWithJQuery and call it from onclick event handler of the <button>.

Tomasz Blachowicz Over a year ago

Here is how you could do this: gist.github.com/994958. Please note that your getJson() function is no longer needed. The onclick event trigger from the <button> has been replaced by proper JQuery event handling i.e. click() function.

|

Artem Barger · Accepted Answer · 2011-05-27 09:16:01Z

3

I would suggest you to use GSON library, which enables you to serialize Java object to json, to avoid writing it by yourself. If you do not want to use GSON, there are plenty of others libraries which uses same capabilities.

//inside your get method

Gson gson = new Gson( );
List<Employe> employees = new ArrayList<Employe>( );

// populate your list here

response.setContentType( "application/json");
response.getWriter( ).println( gson.toJson( employees));


//end

then in javascript you can do as it's already suggested in other answers here. And do pay attention to update response content type.

answered May 27, 2011 at 9:16

Artem Barger

41.3k9 gold badges61 silver badges81 bronze badges

4 Comments

Tomasz Blachowicz Over a year ago

I doubt this solves the issues explained in question. The way the author creates the response on the server side is not the most elegant one, but it produces valid JSON. The issue is on the client side, because the response body is not evaluated as JavaScript.

AabinGunz Over a year ago

I tried the other js methods on this page after downloading Gson library, it is not working, i.e., dosn't show any alert

Tomasz Blachowicz Over a year ago

@Abhishek Have you ever tried to debug your JavaScript code? Try Firebug in Firefox to understand exactly what is going on in your code.

Artem Barger Over a year ago

Didn't aimed to answer a question, since by the time I've wrote this post correct answer is already presented here, just wanted to help with small advice suggesting more nicer way to format output on client.

pap · Accepted Answer · 2011-05-27 08:54:08Z

1

var res=client.responseText;
var temp = 'resObj=' + res;
eval(temp);
alert(resObj.employees.fullname);

JSON is just text, but in javascript syntax. You need to pass it through the "eval" method that will evaluate and execute the text as javascript.

My advice, though, is to use jQuery or some other javascript framework to avoid having to mess with all that boiler-plate javascript.

answered May 27, 2011 at 8:54

pap

27.7k6 gold badges44 silver badges46 bronze badges

1 Comment

AabinGunz Over a year ago

it gives me undefined, ok how can i do it using jQuery? can u show an example function from my code? Also how will i call that function from a JS function?

Buhake Sindi · Accepted Answer · 2011-05-27 09:44:53Z

1

It's because you are receiving the JSON String but you're not converting it into a JSON Object. There's a eval() function that evaluates your JSON String and returns a JSON Object.

The following example should work (though untested).

if(client.readyState==4&&client.status==200)
     {
        var res=eval('(' + client.responseText; + ')');
        alert(res);     
        alert(res.employees[0].fullname);
        alert(res.employees[0].email);   
     }

WARNING: I suggest reading the security concerns when using eval(). Alternatively, go to JSON.org and download a Javascript JSON parser or use JQuery instead.

edited May 27, 2011 at 9:44

answered May 27, 2011 at 9:08

Buhake Sindi

89.5k30 gold badges176 silver badges234 bronze badges

4 Comments

AabinGunz Over a year ago

thanks for the info. also when i use eval as in your edited code, i get [object] from my alert

Buhake Sindi Over a year ago

@Abhishek Simon, I changed my alert() in my code to show the change.

AabinGunz Over a year ago

I got 3 alerts, with the following values [object,Object] undefined undefined

Buhake Sindi Over a year ago

ok, see my edited post again and see if you can get the result doing eval(client.responseText);.

Collectives™ on Stack Overflow

how to get JSON objects from servlet?

4 Answers 4

6 Comments

4 Comments

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

4 Comments

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related