Loading data through Jquery ajax for datagrid?

Question

I have this code snippet(not complete though, ignore the ending script tag) ::

<script type="text/javascript">
function gotoa(){
    var h = $.get("http://localhost:8080/2_8_2012/jsp/GetJson.jsp", function(result) {

    });
    alert(result);


var myVar= h;
var storedata={
            identifier:"ID",
            label:"name",
            items: myVar
    };

var store = new dojo.data.ItemFileWriteStore({data: storedata});

The code for GetJson.jsp is ::

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <%@ page import="MyPackage.PopulateTextbox" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<%

String temp1;
PopulateTextbox obj = new PopulateTextbox();
temp1 = obj.method();
%>

<%=temp1 %>

</head>
<body>


</body>
</html>

I have a j query get method . And the URL i am passing in it returns me an Json array string. Output of URL ::

[{"ID":1,"Names":"Shantanu","Email":"shantanu.tomar@gmail.com"},{"ID":2,"Names":"Mayur","Email":"mayur.sharma@gmail.com"},{"ID":3,"Names":"Rohit"},{"ID":4,"Names":"Jasdeep"},{"ID":5,"Names":"Rakesh","Email":"rakesh.shukla@gmail.com"},{"ID":6,"Names":"Divyanshu"},{"ID":8,"Names":"hello"},{"ID":9,"Names":"fine"},{"ID":10,"Names":"shivani"}]

Now i want this output for my Data grid i.e i want that var myVar should get this value and then it will be passed on to dojo.data.ItemFileWriteStore. I am unable to do so . Please help ? Thanks.

I love the questionmark in "please help ?" – joidegn Mar 14 '12 at 12:39 — joidegn, Mar 14 '12 at 12:39

Anthony Grist · Answer 1 · 2012-03-14T12:53:49.047

The $.get() function is a shorthand for an AJAX call using the $.ajax() function - and, as everybody knows, the first A in AJAX stands for asynchronous. If you want to execute code using the response of an AJAX call, you need to put that code in the callback function passed to $.get().

It may look something like this (though without the code being complete, I can't say for certain:

function gotoa() {
    var store;

    var h = $.get("http://localhost:8080/2_8_2012/jsp/GetJson.jsp", function(result) {
        var myVar = result;
        var storedata={
            identifier:"ID",
            label:"name",
            items: myVar
        };

        store = new dojo.data.ItemFileWriteStore({data: storedata}); 
            // do whatever with store here, if necessary
    });
}

Have tried it Anthony... But is not working .. See the above post... :( — Shantanu Tomar, Mar 15 '12 at 05:40

Nemoy · Answer 2 · 2012-03-15T06:24:37.067

0

modify your script tag like this:

<script type="text/javascript">
function gotoa(){
    $.get("http://localhost:8080/2_8_2012/jsp/GetJson.jsp", function(result) {
        var storedata={
            identifier:"ID",
            label:"name",
            items: result
             };

            var store = new dojo.data.ItemFileWriteStore({data: storedata});
    });

}
</script>

The code for GetJson.jsp is :

<%@page contentType="application/json" %>
<%@page import="MyPackage.PopulateTextbox" %>
<%
String temp1;
PopulateTextbox obj = new PopulateTextbox();
temp1 = obj.method();
%>

<%=temp1 %>

Now call gotoa() it will initialize the ajax call and get the response in callback function

edited Mar 15 '12 at 06:24

answered Mar 14 '12 at 13:00

Nemoy

3,347
1
15
14

I am not getting it ryt Nemoy.. :( its not displaying any error also. But not displaying any result also in data grid. I think items: is not getting the appropriate value. But when i do open the URL i do get the Json array of values which i have given as output in my ques. What may be the reason ? will it make any difference if we change content Type to text/HTML instead of application/json ? thanks. – Shantanu Tomar Mar 14 '12 at 13:43
alert the response and post it here, or can you expose the link? – Nemoy Mar 14 '12 at 14:47
Here's the output whn i open the link http://localhost:8080/2_8_2012/jsp/GetJson.jsp and content type text/html: [{"ID":1,"Names":"Shantanu","Email":"shantanu.tomar@gmail.com"},{"ID":2,"Names":"Mayur","Email":"mayur.sharma@gmail.com"},{"ID":3,"Names":"Rohit"},{"ID":4,"Names":"Jasdeep"},{"ID":5,"Names":"Rakesh","Email":"rakesh.shukla@gmail.com"},{"ID":6,"Names":"Divyanshu"},{"ID":8,"Names":"hello"}] Now when content type is application/json i get the same out with all the html tags also body n all, with the output placed outside body tag, where the scriptlet code is placed. – Shantanu Tomar Mar 15 '12 at 05:25
modify it to `$.get("http://localhost:8080/2_8_2012/jsp/GetJson.jsp", function(result) { alert(result); });` and check whether it is alerting something or not – Nemoy Mar 15 '12 at 06:25
Hey nemoy. I am now getting the data. The response alert gives me an output like [Object object][Object object]... so on(the number of values in my database. and content type is application/json. But when i click the URL does not fetch me the new updated values according to changes in the database. But if i run the URL separately in a browser the new values get updated in the result. And then when i click on pane to update the grid i get the updated values. Is it somewhat related to callbacks ? What may be the reason. please help. Thanks. – Shantanu Tomar Mar 15 '12 at 06:28
1

it might be caching, try cache busting `$.get("http://localhost:8080/2_8_2012/jsp/GetJson.jsp?random=" + new Date().getTime(), function(result) { alert(result); });` – Nemoy Mar 15 '12 at 06:33
Okay .. Now i am getting the [Object object][object object]... values according to the number of database values without refreshing the URL separately.. date time thing is working fine. :) Thanks for that. But grid is not updating itself after that. Is there any specific function for grid to be refresh again and display updated data ? thanks a lot for your help nemoy.. – Shantanu Tomar Mar 15 '12 at 06:40
Great, you can use $.ajax with cache: false to avoid caching. I am not sure about your grid component, – Nemoy Mar 15 '12 at 06:48
Nemoy if u can please help me out on this one http://stackoverflow.com/questions/9716745/refreshing-grid-data-on-click-event Thanx.. :) – Shantanu Tomar Mar 15 '12 at 09:11
http://stackoverflow.com/questions/9736725/data-is-not-getting-displayed-in-dojox-data-datagrid-on-click-event – Shantanu Tomar Mar 16 '12 at 12:06
http://stackoverflow.com/questions/9768294/displaying-data-in-dojogrid-using-dojo-xhrget-method – Shantanu Tomar Mar 19 '12 at 10:29

Loading data through Jquery ajax for datagrid?

2 Answers2

Linked