Hey Thiago, I got it working. Here is the full working code for
anyone else using T5 + JQuery + ajax
NewAjax.class:
import java.util.Date;
import org.apache.tapestry5.ComponentResources;
import org.apache.tapestry5.annotations.Import;
import org.apache.tapestry5.annotations.OnEvent;
import org.apache.tapestry5.ioc.annotations.Inject;
import org.apache.tapestry5.json.JSONObject;
import org.apache.tapestry5.services.Request;
import org.apache.tapestry5.services.javascript.JavaScriptSupport;
@Import(library = "context:/js/testJSON.js")
public class NewAjax {
@Inject
private ComponentResources resources;
@Inject
private Request request;
@Inject
private JavaScriptSupport javaScriptSupport;
public String getEventLink() {
return resources.createEventLink("MyCustomEventName").toURI();
}
void afterRender() {
javaScriptSupport.addScript("setupEvent('%s', '%s');", "linkId",
getEventLink());
}
@OnEvent(value = "MyCustomEventName")
JSONObject myEventHandler() {
// check if this is a AJAX request
if (request.isXHR()) {
String queryParameter1 = request.getParameter("queryParameter1");
String queryParameter2 = request.getParameter("queryParameter2");
JSONObject object = new JSONObject();
object.put("var1", "\n" + queryParameter1.toUpperCase());
object.put("var2", "\n" + queryParameter2.toUpperCase());
object.put("message", getMessage());
// Make your real payload
return object;
}
return null;
}
private String getMessage() {
return "SUCCESS at " + (new Date()).toString();
}
}
NewAjax.tml
<html title="New Ajax"
xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd";
xmlns:p="tapestry:parameter">
<body>
<a id="linkId">Click this Tapestry Link</a>
</body>
</html>
testJSON.js:
function setupEvent(id, theurl) {
alert("here with "+"#"+id);
$("#"+id).click(function() {
var dataObj = {};
dataObj["queryParameter1"] = "Daniel";
dataObj["queryParameter2"] = "Jue";
$.ajax({
url : theurl,
data : dataObj,
dataType: "json",
complete : function() {
alert("AJAX - complete setup by T5()");
},
success : function(result) {
alert("AJAX - success setup by T5() " + result.message+result.var1+result.var2);
}
});
});
}
Of special note are the changes to testJSON.js to make it work with JQuery.
The id must have a '#' symbol. Also the datatype is set to 'json',
but it could be 'html', etc.
Thanks also to Taha and Howard for their input.
On Tue, Jul 16, 2013 at 2:11 PM, Thiago H de Paula Figueiredo
<thiag...@gmail.com> wrote:
> On Tue, 16 Jul 2013 14:31:27 -0300, Daniel Jue <teamp...@gmail.com> wrote:
>
>> If it's the javascript that's at fault one thing that may be causing
>> it is that I'm using Tapestry5-JQuery, which requires a different
>> syntax than prototype's 'observe' and 'click'.
>
>
> You used Prototype in the code you posted, so I thought you were using it
> instead of jQuery. Of course, you'll need to adapt the JS part for jQuery.
>
>
> --
> Thiago H. de Paula Figueiredo
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
> For additional commands, e-mail: users-h...@tapestry.apache.org
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h...@tapestry.apache.org
