Implementing a Data Source with Grails and Query.send method

[bgoetzmann]

Hello,

I've implemented a custom data source using the powerful Grails
framework; here how I use this source in the HTML page:

...
google.setOnLoadCallback(initialize);
function initialize() {
var query = new google.visualization.Query('http://localhost:8080/
grailsbox/visualization/data?responseHandler=myHandler');
query.send(null);
}
function myHandler(response) {
// Tester response.status
var dt = new google.visualization.DataTable(response.table,
response.version);
var chart = new google.visualization.PieChart
(document.getElementById('chart_div'));
chart.draw(dt, {width: 400, height: 240, is3D: true});
}
...

The URL is used to fetch JSON data (using a Grails controller action):

{"version":"0.5","reqId":"1","status":"ok","table":{"cols":[...

All is OK: the graph is displayed! But I remark that a JavaScript
error is generated after 30 seconds. I understood that it's because I
use null in the query.send: the API tries to call an handler.
If I use an handler: query.send(myHandler1); with myHandler1 defined
like this

function myHandler1(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' +
response.getDetailedMessage());
return;
}
}

I see an error message telling "Request timed out".

What I missed? The documentation seems to say to use the Query's get
method, but it is not defined.

Thank you for any help!

Cheers,

Bertrand
http://www.odelia-technologies.com/

[bgoetzmann]

I do a mistake in my last post! The server part send the string:

myHandler({"version":"0.5","reqId":"1","status":"ok","table":{"cols":
[... )

And when, in the client part (JavaScript in the Interner browse) calls
my initialize function with the following code:

var query = new google.visualization.Query('http://localhost:8080/
grailsbox/visualization/data?responseHandler=myHandler');
query.send(null);

my myHandler JavaScript function is well called and the graph is well
displayed on the page!

To repeat the problem I got:

But I remark that a JavaScript error is generated after 30 seconds. I
understood that it's because I
use null in the query.send: the API tries to call an handler.
If I use an handler: query.send(myHandler1); with myHandler1 defined
like this

function myHandler1(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' +
response.getDetailedMessage());
return;
}
}


I see an error message telling "Request timed out".

What I missed? The documentation seems to say to use the Query's get
method, but it is not defined.


Thank you for any help!


Cheers,


Bertrand
http://www.odelia-technologies.com/

[bgoetzmann]

Finally it works, but with an other way!

Instead to use query and call:

query.send(null);

I can use a Grails tag that permits to call an action via AJAX (with
the Prototype library): here the code (the tag is uses in its function
form):

function initialize() {
${remoteFunction(action: 'data', onSuccess: 'fOnSuccess(e);')}
}

If the AJAX call succeeded, the fOnSuccess JavaScript is called:

function fOnSuccess(e) {
var response = e.responseText.evalJSON();
// TODO : Tester response.status

var dt = new google.visualization.DataTable(response.table,
response.version);
var chart = new google.visualization.PieChart(document.getElementById
('chart_div'));
chart.draw(dt, {width: 400, height: 240, is3D: true});
}

I'm very happy to see how Google visualization can be mixed with
Grails!

I will certainly post a new article on this suject on my web site
http://www.odelia-technologies.com.


Cheers,

Bertrand.

> Bertrandhttp://www.odelia-technologies.com/

> > Bertrandhttp://www.odelia-technologies.com/- Masquer le texte des messages précédents -
>
> - Afficher le texte des messages précédents -

[VizGuy]

The right thing to d ois to pass the name of the response handler function to be called as the parameter to the send function:

query.send(myHandler);

and not query.send(null).

I failed to understand why you initially called it with null, is this just a mistake, or is there any reason for this?

VizGuy

[bgoetzmann]

This is because I see that when send(null) is executed, my myHandler
JavaScript function is automatically executed!
This function is defined in my web page, and the URL I use returns the

string:
myHandler({"version":"0.5","reqId":"1","status":"ok","table":{"cols":
[... )

So my initial question was: is it normal?

Bertrand ;-)

On 18 nov, 22:04, VizGuy <viz...@google.com> wrote:
> The right thing to d ois to pass the name of the response handler function
> to be called as the parameter to the send function:query.send(myHandler);
> and not query.send(null).
>
> I failed to understand why you initially called it with null, is this just a
> mistake, or is there any reason for this?
>
> VizGuy
>

> > > > Bertrandhttp://www.odelia-technologies.com/-Masquer le texte des
> > messages précédents -
>
> > > - Afficher le texte des messages précédents -- Masquer le texte des messages précédents -

[VizGuy]

I see the problem now.

You should not return myHandler(...), unless this name was specified in the responseHandler parameter in the request.

Please see more at: http://code.google.com/apis/visualization/documentation/dev/implementing_data_source.html#responseformat

If it wasn't specified, you should return:

google.visualization.Query.setResponse({status:ok, ...})

Which will in turn call your handler automatically.

This is a static function that gets all of the responses, and dispatches them to the correct handlers (myHandler, in your case).

VizGuy

[bgoetzmann]

Hello,

I tried the two methods:

- by using myHandler for the responseHandler parameter in my URL
In that case if I couldn't call query.send (with null or with another
JS function) my myHandler function wasn't called.
If I call query.send(anotherHandler) I was be able to able to draw the
graph in the myHandler function; but had another call after 30 s to
anotherHandler; and by tracing the received message; I got "request
timeout".
This is the reason why I tried query.send(null); in that case, all is
well, but got a JavaScript error after 30s, because of thee null I
suppose.

In that method, must I have to call query.send? But with which
argument?

- I tried also the other method where the server part returns

google.visualization.Query.setResponse({status:ok, ...})

The JS function passed in the send.query(myHandler) is well called but
after 30s, and the message I get is "request timeout"

What do you think about the method I proposed (using protoype and
AJAX) and that works? Ideally it would best to use the Google
Visualization API, isn't it?

Cheers,

Bertrand.

On 20 nov, 09:19, VizGuy <viz...@google.com> wrote:
> I see the problem now.
> You should not return myHandler(...), unless this name was specified in the
> responseHandler parameter in the request.

> Please see more at:http://code.google.com/apis/visualization/documentation/dev/implement...

>
> If it wasn't specified, you should return:
> google.visualization.Query.setResponse({status:ok, ...})
>
> Which will in turn call your handler automatically.
> This is a static function that gets all of the responses, and dispatches
> them to the correct handlers (myHandler, in your case).
>
> VizGuy
>

> > > > > > Bertrandhttp://www.odelia-technologies.com/-Masquerle texte des

[VizGuy]

I fail to follow your description, so I will write what you should do, and please let me know if this is still not working, and provide any details that you can.

In teh responseHandler value of the tqx parameter, you can specify a function to be called when the response is received. You should *not* use this option.

By not specifying anything, our default hander is called.

This is a static function that in turn calls the function that you specified in query.send();

So, all you have to do is:

var query = new google.visualization.Query(data source url);

query.send(myHandler);

and then...:

function myHander(response) {

}

And this function will be called once the response is received.

If you get timeout, it means that there might be a problem in the data source url.

Please try to type it in the browser's address bar, and see if you get any response.

VizGuy

[bgoetzmann]

OK,

I use this calls :

var query = new google.visualization.Query('http://localhost:8080/

grailsbox/visualization/data');
query.send(myHander);

where myHandler is a JS function like this:

function myHander(response) {
...
}

Here my results:

- case 1: the URL returns a correct text:
{"version":"0.5","status":"ok","table":{"cols":[{"id"...
At page load I get the JS error showed in Firebug as "invalid
label" {"version":"0.5","status":"ok","table":{"cols":[{"id"...
and the response I get in myHander is a "request timeout" after 30s

- case 2 : the URL returns the text:
google.visualization.Query.setResponse
({"version":"0.5","status":"ok","table":{"cols":[{"id"...)
At page load I don't get any JS error, and the response I get in
myHander is a "request timeout" after 30s


Cheers,

Bertrand.

On 24 nov, 14:29, VizGuy <viz...@google.com> wrote:
> I fail to follow your description, so I will write what you should do, and
> please let me know if this is still not working, and provide any details

> that you can.In teh responseHandler value of the tqx parameter, you can

> specify a function to be called when the response is received. You should
> *not* use this option.
> By not specifying anything, our default hander is called.
> This is a static function that in turn calls the function that you specified
> in query.send();
>
> So, all you have to do is:
> var query = new google.visualization.Query(data source url);
> query.send(myHandler);
>
> and then...:
>
> function myHander(response) {
>
> }
>
> And this function will be called once the response is received.
> If you get timeout, it means that there might be a problem in the data
> source url.
> Please try to type it in the browser's address bar, and see if you get any
> response.
>
> VizGuy
>

[VizGuy]

The problem is that there is no "reqId" property in your response.

We documented it as an optional parameter, for cases it is not specified in teh request.

We are changing the docs now, though, because people get confused.

Take it as a required property in the response, containing the same value passed in that field in the request.

This is how the static function dispatches the responses to the handlers.

I believe that if you add this one to the response JSON, it will work.

VizGuy