Creating Web Calendar with Grails and jquery

The reader that this article faces

The reader should have some experience with web development and have some knowledge of CSS, Ajax, Groovy and other technologies, as well as Grails and jQuery-related frameworks.

Grails,jquery,jquery Plugin Introduction

Grails is a set of open source frameworks for fast WEB application development, based on the Groovy programming language and built on Spring, Hibernate, and other standard Java frameworks, creating a one-stop framework for achieving high productivity.

JQuery is a JavaScript library that helps simplify JavaScript™ and asynchronous JavaScript + XML (Ajax) programming. Unlike a JavaScript library like this, JQuery has a unique rationale for succinctly representing Common, complex code.

The jquery Plugin (jquery plug-in) is a standard extension of the existing functionality of the jquery framework. This is the way developers can extend the existing functionality of jquery and publish it through the jquery community. The jquery Plugin greatly expands the functionality of jquery and facilitates reuse by other developers. Some powerful jQuery Plugin, such as this article will use Fullcalendar, Qtip greatly simplifies the development of complex WEB applications and shortens the development cycle.

There are a series of articles on Grails, jquery, and jquery plugin,developerworks that are not covered in detail.

Sample Programs

This article will use Grails, JQuery, and its plug-ins to create an Ajax Web Calendar. Users can visually view the management schedule by using the Ajax calendar interface. This article introduces and discusses how to flexibly use Grails's rapid development framework, publish the JSON data service, and combine the dynamic presentation schedule data of JQuery and its plug-ins.

Background information

At present, many famous internet companies have published Web Calendar, such as Google, Yahoo, Microsoft and so on. In contrast to traditional Web calendar calendars, the newest program presents the user's schedule to the end user in an intuitive way, and can be displayed on a monthly, weekly, and daily basis. At the same time, with Ajax technology, the use of local content dynamic update, greatly improve the user experience.

If you use a traditional Web development framework, the cycle of developing one such web Calendar will be relatively long. From the persistence layer data model and the data source, the service and the controller of the business logic layer to the front-end display of the WEB, the traditional development way needs to expend the great effort to develop each component separately. And Grails, the new WEB development framework, appears to address these issues. It takes the form of development similar to the Ruby on Rails framework and uses the groovy language as the development language, making the program code concise and easy to publish the data service in JSON format through the functionality provided by Grails itself. For many Ajax programs, JSON-formatted data is easier to parse and process on the browser side than in XML format. For complex Ajax applications like online calendars, JQuery, as a powerful lightweight JavaScript framework, can greatly simplify complex DOM operations and JavaScript programming. Its rich and powerful plug-in library is further simplified to facilitate the development of the work. This article will use jquery's Fullcalendar and Qtip Plug-ins to assist in Web front-end development.

The overall architecture diagram, as shown in the following illustration:

Figure 1. Architecture diagram

Main steps

The sample program development involved in this article will include the following major steps:

Use Grails to create the pages and services related to the schedule management.