Tag Archives: Play Framework 2.4.x javascript router javascriptrouter

Play Framework JavascriptRouter Connecting to a Java Controller

Just wanted to go over some of the basics of making use of the

javascriptrouter javascript routing capability in the Play Framework

.  I won’t go in to any major detail but instead will give examples of the minimal setup in Play necessary to get this working.  With this functionality, you can access back end data through your Java controller from a page without a page refresh.  While there are several ways of doing this, wrapping things with Play provides a simple, consistent path with powerful implications.

First, add a route for javascript routing to use and a route for the method that will be called in the routes file:

GET /assets/js/routes controllers.Application.jsRoutes()

GET /cities/:id controllers.Application.getCities(id: Long)

In this, I am passing a simple integer parameter to the getCities method in my Application controller.

Now, in your template, add this script to expose this route

<script src="@controllers.routes.Application.jsRoutes()" type="text/javascript"></script>

You will probably want to throw this in to your main template. This is the one that holds your basic page layout, headers, footers, standard menu items etc. This way it will be available in all of the other templates that include the main template.

In your controller, set up a method to handle javascript routes and a method corresponding to the getCities(int) call

public Result getCities(Long id) {
System.out.println("in getCities in the Application controller");
System.out.println("The id passed in is " + Long.toString(id));
return ok();

public Result jsRoutes()
return ok(Routes.javascriptRouter("appRoutes", //appRoutes will be the JS object available in our view

I’m not doing anything here or passing anything back. Once you have this working, it is up to you what you want to return to the call from javascript. This method simply displays the id passed in to show that it is being called.

Finally, in the template you wish to fetch data for, add the code to make your call through the router from javascript. In this example I am simply passing in a parameter of 1 and showing the returned string data in an alert box. In the provided java method, nothing is returned. You will want to do something real in your method and pass back something useful.

appRoutes.controllers.Application.getCities(1).ajax({success : function(data) {alert(data);});

A reworked and more useful example of the controller method here sends back a set of json formated key value pairs.

public Result getCities(Long id) {
Map cities = City.options(id);
Gson gson = new GsonBuilder().create();
String json = gson.toJson(cities);
return ok(json);

That’s all there is to it! Now that you have the page talking to the controller, you can do most anything you might normally handle with a submit and page refresh without sending back a whole page. For example, as I may be preparing to in this case, load up a list of cities in a dropdown based on a selected state (onchange event) in another dropdown. The documentation I’ve seen on this is mostly geared towards those writing their controller in Scala too. Play has very good support for Java and will hopefully continue to allow both Java and Scala controllers in the future. It is currently my favorite way of putting Java to use on the web. If the 3.x versions of Play become even more Scalified, that is, the option of writing model and controller code in Java rather than Scala goes away, I will abandon Play and try something else. Basically I am saying, if I have to program everything in Scala, I would just as soon make the move to NodeJS. I am using Play specifically because of the cool way it handles routing web requests to Java code. The Scala you have to use in templating is fairly simple. I’ve even developed a few little Scala tricks I’ve become fond of in my template code. However, I’m not at all interested in developing complex application logic in Scala or javascript for that matter. Scratch the NodeJS comment. I’ll just skip the framework all together and create REST stuff by hand. For now though, the Play framework has been a great addition to my web application strategy. This javascript routing stuff is an example of just how slick it is as a framework for modern web applications.

For more information, check out this article which goes in to a little more detail on javascriptrouters in play with java controller code