Thursday, January 5, 2012

Sons of DHTMLX and Spring Series

Episode 1: Home
After a long Christmas break, traveling, reading, playing with kids and eating my favorite  Roberto's burritos (carne asada with the works: pico di gallo, guacamole, cheese and sour cream), it is time to return to the blog and give my best wishes of a happy New Year to  all readers.  

In the early days of the DHTMLX Java Tag library some developers of a large financial company asked me to give code examples with the Spring Framework. I have also received requests from blog readers to provide examples of using DHTMLX and Spring, so I am taking the opportunity to write a series (see also episode 2 , episode 3 and episode 4) of posts on the subject. 
I have dug up my old examples, updated them to run with Spring 3.1, DHTMLX 3.0 and Google App Engine and packaged in a simple web application. Part of the DHTMLX Spring Adapter code presented comes from an open source library that will be included in the upcoming release (sometime in 2012) of the DHTMLX Java Tag Library.

DHTMLX Server Side
As extension of the JavaScript component library DHTMLX delivers a free open source Java package (dhtmlxConnector) for server side integration.  The connector provides  all the functionality needed to integrate the major database servers. Below is a Java code sample to connect a dhtmlxGrid to a database table: 
  1. /**
  2.  * DHTMLX Grid Connector Example
  3.  */
  4. public class BasicConnector extends ConnectorServlet {
  5.    @Override
  6.    protected void configure() {
  7.       Connection conn= ( new DataBaseConnection()).getConnection();
  9.       GridConnector c = new GridConnector(conn);
  10.       c.dynamic_loading(100);
  11.       c.render_table("table", "id", "field1,field2");
  12.    }
  13. }
With the dhtmlxConnector you can have a working dhtmlxGrid in minutes if you have direct access to the database; however, the design of the connector does not allow you to get the same result in a environment where the persistence layer is based on JDO/JPA.  

Spring MVC
In order to get the advantage of the many features that the framework offers, Spring developers adopt a well defined architecture. A typical basic Spring Web Application consists of a  Model, Controller, Service and Repository.
  1. /**
  2.  * Model
  3.  */
  4. public class Book {
  5.     private Long id;
  6.     private String author;
  7.     private String title;
  8.     private Integer sales;
  9.     private Integer price;
  10. }
  1. /**
  2.  * Controller
  3.  */
  4. @Controller
  5. public class BookController {
  6.     @Autowired
  7.     private BookService bookService;
  8.     @RequestMapping(value = "/books", method = RequestMethod.GET)
  9.     public void getBooks() {
  10.         List<Book> books = bookService.getBooks();
  11.         ...
  12.     }
  13. }
  1. /**
  2.  * Service
  3.  */
  4. public interface BookService  {
  5.     List<Book> getBooks();
  6.     Book getBook(String id);
  7.     Book store(Book book);
  8. }
  1. /**
  2.  * Repository
  3.  */
  4. public interface BookDao {
  5.     Book find(String id);
  6.     List<Book> findByTitle(String title);
  7.     Book store(Book book);
  8.     List<Book> findAll();
  9. }

Request Mapping
Spring provides a powerful and flexible Java annotation for request mapping. There are many schools on the request mapping design. The table below highlight the URL mapping of the example application presented in the series:

List books
Create/Update book
Get book (id)

DHTMLX Spring Adapter
The sample application of the series illustrates an approach how to integrate a Grid and a Form component with the Spring Framework. Below is the code example for the Controller class using the DHTMLX Spring Adapter.
  1. /**
  2.  * DHTMLX Spring Adapter Example
  3.  */
  4. @Controller
  5. public class BookController {
  6.   @Autowired
  7.   private BookService bookService;
  8.   @RequestMapping(value = "/books", method = RequestMethod.GET)
  9.   public GridAdapter getBooks(@RequestParam("c") String c) {
  10.     GridAdapter adapter = new GridAdapter(c,Book.class);
  11.     adapter.setData( bookService.getBooks() );
  12.     return adapter;
  13.   }
  14.   @RequestMapping(value = "/books/{id}", method = RequestMethod.GET)
  15.   public FormAdapter getBook(@PathVariable("id") final String id) {
  16.     Book book = bookService.getBook(id);
  17.     FormAdapter adapter = new FormAdapter( book );
  18.     return adapter;
  19.   }
  20.   @RequestMapping(value = "/book", method = RequestMethod.POST)
  21.   public FormAdapter storeBook(@Valid @ModelAttribute Book book, ...) {
  22.     FormAdapter adapter = new FormAdapter(book,binding);
  23.     if( adapter.hasValidData() ) {
  25.     }
  26.     return adapter;
  27.   }
  28. }
Looks familiar, huh?
The series will cover many aspects of the integration of Spring and DHTMLX trying to get the best of both worlds, including client and server site validation, MVC architecture, and URL mapping best practice.

In the upcoming episodes I will go deep in the code, illustrating  the design of the DHTMLX Spring Adapter. Below is the list of  Sons of DHTMLX and SPRING  episodes: 

Episode 1: Home
Introduction to the DHTMLX Spring Adapater (this post)

Episode 2: Caregiver
Take care of your objects with client and server side validation  (released 01/11/12)

Episode 3: Turning and Turning
Spring MVC annotation driven configuration (released 01/18/12)

Episode 4: Fruit for the Crows
Full Source code delivery (released 02/16/12)

Episode 5: Call of Duty 
Get involved and contribute to the open source development (released 02/22/2012)

Stay Tuned!


  1. Replies
    1. Great Article android based projects

      Java Training in Chennai Project Center in Chennai Java Training in Chennai projects for cse The Angular Training covers a wide range of topics including Components, Angular Directives, Angular Services, Pipes, security fundamentals, Routing, and Angular programmability. The new Angular TRaining will lay the foundation you need to specialise in Single Page Application developer. Angular Training Project Centers in Chennai

  2. good stuff. looking forward to further postings from you.