Integrate Jquery DataTable with Scala Play Framework

Table of contents
Reading Time: 3 minutes

In this blog post, I’ll explain the integration of DataTable jQuery plugin with Scala Playframework.

DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool and provide many feaures.
->Variable length pagination
->On-the-fly filtering
->Multi-column sorting with data type detection
->Smart handling of column widths
->Display data from almost any data source
-Javascript array
-Ajax source
-Server side processing

We are going to build application using data source server side processing. Here is the steps to integrate datatable:

1- Create Play Application

$ play new DataTable

2- Set Database
sudo -u postgres psql postgres
sudo -u postgres createdb mydb
3- Set up Database credential and Driver in application.conf

4- Create Table through Slick 2.0

5- Download datatable library jquery.dataTables.min.js and css file jquery.dataTables.css and put those files and images  in related folders

6- Define  route for datatable source in routes file

# Routes
# This file defines all application routes (Higher priority routes first)
# ~~~~

# Home page
GET / controllers.Application.index
GET /search controllers.Application.list()

# Map static resources from the /public folder to the /assets URL path
GET /assets/*file”/public”, file)

7- Write Database abstraction layer (SuppliersDAL.scla)

8- Define Action for datatable source (Application.scala)

9-  Define Table Template for datatable and initialize datatable (index.scala.html)

 Initialize datatable :

DataTable will look like:

Welcome to Play 2.1

Steps to Run Application:

1- Clone code from

2- $ play run

3- http://localhost:9000/

4- have fun…:-)

1 thought on “Integrate Jquery DataTable with Scala Play Framework5 min read

  1. Thanks for this. Of course it would be far more helpful to use dataTables as an external library and loaded into the Build

Comments are closed.