Ajax with Play! Framework and Sammy.js
Ajax with Play! Framework and Sammy.js
Join the DZone community and get the full member experience.
Join For FreeDownload Microservices for Java Developers: A hands-on introduction to frameworks and containers. Brought to you in partnership with Red Hat.
So let me the explain the setup real quick because it seems those EJBs finally re-deployed. I used Play!'s main layout file to include JQuery, Sammy.js and define the application code, it looks something this:
<!-- Sammy App --> ;(function($) { // Define Sammy App var app = $.sammy('#main', function() { // Util Params this.debug = false; var form_fields = null; // Home - Application.searchForm() this.get('#/', function() { var action = #{jsAction @searchForm() /} this.partial(action()); }); // Search - Application.search() this.get('#/search', function() { form_fields = this.params; var action = #{jsAction @search(':search', ':startPage') /}; this.partial(action({search: form_fields['q'], startPage: form_fields['startPage']})); }); // Repository Details - Application.repository() this.get('#/repository/:user/:repository', function() { form_fields = this.params; var action = #{jsAction @repository(':user', ':repository') /}; this.partial(action({user: form_fields['user'], repository: form_fields['repository']})); }); // User Details Page - Application.user() this.get('#/user', function() { form_fields = this.params; var action = #{jsAction @user(':userName') /}; this.partial(action({userName: form_fields['userName']})); }); }); $(function() { app.run('#/'); }); })(jQuery);
That's the one-page Sammy.js setup, notice that when you get a request on the homepage Sammy.js will invoke the following code:
// Home - Application.searchForm() this.get('#/', function() { var action = #{jsAction @searchForm() /} this.partial(action()); });
Play! will convert "#{jsAction @searchForm() /}" into a function that constructs an url that would invoke searchForm() on whatever controller you are using, Application on my case. Then Sammy.js uses that function to invoke the controller, get the response back in HTML. Just remember to remove extends from the first line of the view so the header doesn't get included twice, remember the page isn't getting refreshed, just the interior content.
That's pretty much it!
For a complete example with a fully functional demo please fork the code on GitHub.
Hopefully this is going to be helpful to you! Let me get back to restart JBoss, I got a huge deadline to make tomorrow and I am dead tired.
Live demo is available here.
Now Go Play!.
Article originally posted at http://geeks.aretotally.in/ajax-with-play-framework-and-sammy-js by Felipe Oliveira.
Download Building Reactive Microservices in Java: Asynchronous and Event-Based Application Design. Brought to you in partnership with Red Hat.
Opinions expressed by DZone contributors are their own.
{{ parent.title || parent.header.title}}
{{ parent.tldr }}
{{ parent.linkDescription }}
{{ parent.urlSource.name }}