Ugh, still not working for me yet. Once I get it though, things should
really get moving.
Here's what I have. The intent is a simple event link on a page, that,
when click on, performs an ajax call to get a json payload, and then
displays the payload as the contents to a javascript alert().
I figure from this simplified problem I can create real payloads and assign
them to meaningful javascript variables.
Something is obviously missing, but I'm at a loss for what. This is
probably my 20th iteration of it since the last email. Of note is that in
sendJson(), the request is NOT XHR, even though it's being called from an
event link with a zone.
Any ideas? I'd really like to just get this working. It seems like this
would be a very common need, to provide json to js visualizations from
pages without having to stand up separate REST services. I poked around in
tapestry5-jquery and tapestry5-highcharts, but didn't see an obvious
example.
NewAjax.java:
@Import(library = "context:/js/testJSON.js")
public class NewAjax {
@Inject
private AjaxResponseRenderer ajaxResponseRenderer;
@Inject
@Property
private JavaScriptSupport javaScriptSupport;
@Inject
private ComponentResources resources;
@InjectComponent
private Zone someZone;
@InjectComponent
private EventLink jsonCallbackLink;
@AfterRender
private void addJavaScript() {
javaScriptSupport.addInitializerCall("testJSON",
jsonCallbackLink.getClientId());
}
@Inject
private Request request;
@OnEvent("sendJSON")
void sendJSON() {
if (request.isXHR()) {
// use AjaxResponseRenderer
ajaxResponseRenderer.addCallback(new JSONCallback() {
public void run(JSONObject reply) {
// generate my custom JSON payload here
reply.put("message", "my message");
}
});
}
}
}
NewAjax.tml
<html title="New Ajax" xmlns:t="
http://tapestry.apache.org/schema/tapestry_5_3.xsd";
xmlns:p="tapestry:parameter">
<body>
<t:zone t:id='someZone'>
This is someZone
</t:zone>
<a t:type='eventLink' t:zone="someZone" t:id='jsonCallbackLink'
t:event='sendJSON'>
Click this link to generate JSON!
</a>
</body>
</html>
testJSON.js:
Tapestry.Initializer.testJSON = function(elementId){
$(elementId).observe("click", function(event){
Tapestry.ajaxRequest($(elementId).href, function(response){
alert(response.responseJSON.message);
});
event.preventDefault();
});
};
On Mon, Jul 15, 2013 at 9:08 PM, Taha Hafeez Siddiqi <
[email protected]> wrote:
> EventLink must have its zone parameter set to a zone for it to use ajax.
> Remember not to use an empty zone(because of a bug in 5.3). If you want to
> use an empty zone just add to it.
>
>
> On 16-Jul-2013, at 6:30 AM, Daniel Jue <[email protected]> wrote:
>
> > Thanks Taha and Howard! Looks like I have some more learning to do,
> which
> > is always great.
> > BTW, I'm on T5.3.6.
> >
> >
> > Howard, for my purposes the JSON payload for the visualization needs to
> be
> > generated at runtime when the user clicks (I'll eventually have dozens of
> > clickable links, each one a costly calculation)--your solution sounds
> like
> > the json is getting pre-calculated (unless I am interpreting it wrong,
> > which is likely)
> >
> > I was trying one of Taha's old examples that seemed similar (
> >
> http://apache-tapestry-mailing-list-archives.1045711.n5.nabble.com/Updating-a-page-with-a-JSONObject-td3339940.html
> > )
> > But I'm getting an error with that. Possibly because I'm trying to
> trigger
> > the Ajax response through an eventlink I added to the TML, with no Zone.
> > Do I need to make use of a zone component at all? I'm getting an
> > error of "Page
> > must be specified before initializing for partial page render."
> >
> >
> >
> >
> > On Mon, Jul 15, 2013 at 7:30 PM, Howard Lewis Ship <[email protected]>
> wrote:
> >
> >> Build a URL using resources.createEventLink() and pass this down to the
> >> browser.
> >>
> >> From the event handler, construct and return a JSONObject.
> >>
> >> Have the client trigger the provided URL, then pass the response.json to
> >> the fd.loadJSON() method.
> >>
> >> There's a bunch of other variations on this; for instance, you can
> create a
> >> initializer function (in 5.3) or a module (in 5.4) and pass the JSON
> object
> >> to the initalize function, or the module, via JavaScriptSupport.
> >>
> >>
> >> On Mon, Jul 15, 2013 at 4:21 PM, Daniel Jue <[email protected]> wrote:
> >>
> >>> Hi, I'm getting back into Tapestry development, specifically needing to
> >> do
> >>> some dynamic front end work I haven't attempted before.
> >>>
> >>> I have a 3rd party JS library (Infovis) which draws a graph using JSON
> >>> data.
> >>>
> >>>
> >>
> http://philogb.github.io/jit/static/v20/Jit/Examples/ForceDirected/example1.html
> >>>
> >>> The starter example uses
> >>>
> >>> var json = "...the sample graph data.."
> >>>
> >>> and then later on there is call to
> >>>
> >>> 1. fd.loadJSON(json);
> >>>
> >>>
> >>> What I'd like to do is have the user click on an action/event link and
> >> then
> >>> have the var json variable returned from the server side, and then have
> >>> fd.loadJSON() called.
> >>>
> >>> What is the most direct and preferred way of doing this? (Preferably
> >>> without extra dependencies)
> >>>
> >>>
> >>> Thanks
> >>>
> >>
> >>
> >>
> >> --
> >> Howard M. Lewis Ship
> >>
> >> Creator of Apache Tapestry
> >>
> >> The source for Tapestry training, mentoring and support. Contact me to
> >> learn how I can get you up and productive in Tapestry fast!
> >>
> >> (971) 678-5210
> >> http://howardlewisship.com
> >>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [email protected]
> For additional commands, e-mail: [email protected]
>
>
