Hello,
I've been working with the Wicket 1.2 snapshot to try and integrate some
more complex DOJO Ajax code for my site.
In short (to give you an idea of what I'm trying to accomplish), I have
a weblog with entries and comments. When the user clicks on 'View
Comments', I'd like to use DOJO to pull down the comment list xhtml,
create a DOM out of it, and then wipe it in using dojo fx.
Here is the interesting part - my comment list already exists as a
Wicket Panel object - so the Wicket side of the equation is almost
modularized completely. Here is what I have done, and where I am getting
stuck - I'll append the source code for the various parts I'm discussing
below:
I've created a BlogCommentAjaxHandler that effectively adds unique dojo
functions for each blog entry to the top of the page. One of the
behaviors of the dojo function is to callback to the server, asking for
the result of the AJAX (using AjaxHandler.getCallbackUrl()). The custom
AjaxHandler I wrote overrides 'respond()', and instead of using the
ResourceStreamRequestTarget, it uses a ComponentRequestTarget with a
component of my BlogCommentsPanel (the plot thickens!)
I've then registered the AjaxHandler on to the ListItem for my blog
entry, and associated it with a triggering component (a label to which
I've added an on-click).
Now, everything works up until the point it performs the callback, at
which time Component.getPage() on my BlogCommentsPanel throws an
IllegalStateException because it doesn't have a Page object. What is
interesting is that ComponentRequestTarget is written to assume that the
Page may be null, but Component.getPage() (which is final) returns null.
To make testing easier, I have currently made it so that the
BlogCommentsPanel is passed in to the AjaxHandler - obviously I'd like
to make it so this component can be built lazily from the user's request
(deferring the work to the Ajax request itself). That's not reflected in
the code below!
Any help/thoughts on where to go from here would be greatly appreciated.
Here is a general sketch of my ajax handler:
import wicket.*;
import wicket.markup.html.HtmlHeaderContainer;
import wicket.model.Model;
import wicket.request.target.ComponentRequestTarget;
public class BlogCommentAjaxHandler extends AjaxHandler {
private Component component;
private Component elementToRender;
private Component trigger;
private String componentId;
private String htmlId;
public BlogCommentAjaxHandler(Component elemToRender, Component
trigger) {
this.trigger = trigger;
this.elementToRender = elemToRender;
}
@Override protected String getImplementationId() {
return "DojoImpl";
}
@Override protected void respond() {
RequestCycle requestCycle = RequestCycle.get();
// TODO - implement code to use component as request target.
requestCycle.setRequestTarget(new
ComponentRequestTarget(elementToRender));
}
/**
* The duration of the animation.
*/
protected int getDuration() {
return 500;
}
protected Component getTrigger() {
return trigger;
}
protected void onBind() {
Component c = getComponent();
this.component = (Component) c;
this.componentId = c.getId();
// create a unique HTML for the wipe component
htmlId = this.component.getId() + "_" + component.getPath();
// Add ID to component, and bind effect to trigger
this.component
.add(new AttributeModifier("id", true, new Model(htmlId)));
this.getTrigger().add(
new AttributeModifier("onclick", true, new Model("comp_"
+ componentId
+ "_expandComments('" + htmlId + "', '" +
getCallbackUrl() + "', " + getDuration()
+ "); return false;")));
}
public final void renderHeadContribution(HtmlHeaderContainer container)
{
String wipingVarName = "comp_" + componentId + "_wiping";
String s = "\t"
+ "<script language=\"JavaScript\" type=\"text/javascript\">\n"
+ wipingVarName + "= 0; \n"
+ "function comp_"+ componentId + "_expandComments(id,
componentUrl, duration) { \n"
+ "if("+ wipingVarName + "==0){\n"
+ "node = document.getElementById(id);\n"
+ wipingVarName + "= 1;\n"
+ "dojo.io.bind({\n"
+ "url: componentUrl,\n"
+ "mimetype: \"text/xml\",\n"
+ "load: function(type, data, evt) {\n"
+ "var dom = dojo.dom.createDocumentFromText(data, mimetype);\n"
+ "dojo.dom.insertAtIndex(dom, node, 0);\n"
+ "}});\n"
+ "dojo.fx.html.wipeIn(dom, duration, function(){"
+ "dom.style.height='auto';});\n"
+ "\t\t" + "}\n"
+ "\t" + "}\n"
+ "\t" + "</script>\n";
container.getResponse().write(s);
}
}
-------------------------------------------------------
This SF.net email is sponsored by: Splunk Inc. Do you grep through log files
for problems? Stop! Download the new AJAX search engine that makes
searching your log files as easy as surfing the web. DOWNLOAD SPLUNK!
http://ads.osdn.com/?ad_id=7637&alloc_id=16865&op=click
_______________________________________________
Wicket-user mailing list
Wicket-user@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/wicket-user
