With jQuery Calendar and Date Pickers it is quite simple to add cool calendar features to nearly any website. jQuery is a cross-browser JavaScript library designed to simplify the client-side scripting of HTML. It was released in January 2006 at BarCamp NYC by John Resig. Used by over 41% of the 10,000 most visited websites, jQuery is the most popular JavaScript library in use today. I believe that jQuery is the best JavaScript library because it’s easy to use, flexible and has a lot of tutorials and plugins allowing you to integrate nearly any front end function into your site. Implementing a calendar in the web application is also made easy when using jQuery event calender and date picker plugins. Event calendars and date pickers are really useful for web applications and is a good way to communicate any kind of event relevant to the site or business publishing it. jQuery is also useful in many other areas and in particular jQuery carousel plugins can give a website a facelift. For this article I have found 30 useful jquery Calendar and jquery datepicker plugins web designers, freelancers and bloggers should be aware of. Another very popular type of jQuery scripts are jQuery Slider Plugins.

1. EvenTouch Calendar

eventouch

MORE INFO / DEMO by CodeCanyon (premium plugin)

2. Jquery Week Calendar

Jquery Week Calendar

jQuery Week Calendar is a plugin which will include a weekly calendar in the web application. The events can be supplied as an array or JSON, and these events can be easily drag, drop and resize. There are a lot of options and event callbacks which you can refer through the official plugin page.

3. AJAX Booking Calendar Pro (jQuery Calendar Plugin)

AJAX Booking Calendar Pro (jQuery Calendar Plugin)

This item is ideal if you want to add information about bookings to your rentals website. The Back End is easy to use and can be easily integrated into your own CMS as the Front End can be easily integrated into your website. Both Back End and Front End can be customized separately, and the number of usages on your webpage or website is unlimited. The Calendar comes with a PHP script, but any server side script can be used to load or to save data from any database. The Booking Calendar is compatible with all browsers and devices (iPhone, iPad and Android smartphones).

MORE INFO / DEMO by CodeCanyon (premium plugin)

4. glDatePicker

glDatePicker

glDatePicker is a simple, customizable, lightweight date picker calendar plugin for jQuery weighing in 4KB compressed

5. Timeline calendar

Timeline calendar

Timeline is simple JavaScript driven calendar, which is written on top of jQuery JavaScript framework. Timeline is a horizontal representation of days in month. It can be used to display unlimited number of events with their descriptions.

MORE INFO / DEMO by CodeCanyon (premium plugin)

6. wdCalendar

wdcalendar

wdCalendar is a jquery based google calendar clone. It cover most google calendar features. User can choose to have a daily view, weekly view or monthly view. User can easily create, update or remove events by drag & drop. It is very simple to to integrate wdCalendar with a database.

7. Event Calendar

EventCalendar1

Event Calendar is a jquery Calendar and ColdFusion event calendar that works a lot like the Google Calendar system. With Event Calendar, you can share calendar information throughout your organization. There is also a simple user facade, that you can extend, to help control user rights.

8. Simple Events Calendar JS

image

Professional & Elegant Calendar, special for Modern web designs, templates etc.

MORE INFO / DEMO by CodeCanyon (premium plugin)

9. VCalendar

vcalendar

VCalendar (Virtual Web Calendar) is an open source Web calendar application for posting and maintaining events and schedules online, in calendar format. This is an excellent and free jquery Calendar solution for use by online Web communities and any commercial and non-commercial organizations. Unlike any other online calendars, VCalendar comes with source code in multiple programming languages: PHP, ASP and ASP.NET with potential for adding more technologies in the future.

10. jQuery Date Range Picker

image

Simple jQuery UI date picker extension to allow user to choose date ranges. When user chooses a date, a hidden form is submitted. Uses jQuery 1.6 and jQuery UI 1 .8. Tested in and compatible with IE 6 -9, Firefox, Safari, Chrome, and Opera.

MORE INFO / DEMO by CodeCanyon (premium plugin)

11. jQuery.calendarPicker

jquery calendar picker

This component is a light-weight jquery Calendar/date-picker. Some features are – support for internationalization, changing current date, supports mouse wheel scrolling and much more

12. Date Picker

DATEPICKER

Date Picker component with a lot of options and easy to fit in your web application.

13. Unobtrusive Date-Picker Widget Update

unobtrusive date picker

A datePicker ( jquery Calendar) that is accessible using the keyboard, requires no embedded JavaScript blocks, uses no pop-up windows and is suitable for use within documents served as application/xhtml+xml.

14. jQuery TimelineXML

timeline

MORE INFO / DEMO by CodeCanyon (premium plugin)

15. Date Range Picker using jQuery UI 1.7 and jQuery UI CSS Framework

date range date picker

The range jquery Calendar picker now uses the latest version of jQuery UI’s datepicker, and allows passing of native datepicker options.

16. jQuery Datepicker

jquery datepicker

A datepicker can easily be added as a popup to a text field or inline in a division or span with appropriate default settings. The popup shows when the field gains focus and is closed by clicking on the Close link or clicking anywhere else on the page. You can also remove the datepicker widget if it is no longer required.

17. CuteTime

cuet time

CuteTime is a customizable jQuery plugin that automatically converts timestamps to formats much cuter. Also has the ability to dynamically re-update and/or automatically update timestamps on a controlled interval.

18. Multiday Calendar Datepicker JQuery Plugin

multiday

Multi-day, multi-month animated datepicker jquery Calendar plugin that weighs in at 14KB with the uncompressed development version.

19. jQuery Frontier Calendar

FrontierCalendar09

Full month calendar jQuery plugin that looks like Google Calendar. All UI elements such as next-month & previous-month buttons, add event form, edit event form, tooltips, etc, are not part of the calendar plugin. These are to be created by you so you can control how they look. Use the API hooks in your form elements to control the calendar.

20. jQuery UI Datepicker

UI datepicker

The jQuery UI Datepicker is a highly configurable plugin that adds datepicker functionality to your pages. You can customize the date format and language, restrict the selectable date ranges and add in buttons and other navigation options easily. By default, the datepicker calendar opens in a small overlay onFocus and closes automatically onBlur or when a date is selected. For an inline calendar, simply attach the datepicker to a div or span. You can use keyboard shortcuts to drive the datepicker:

21. oCalendar -jquery Event Calendar Plugin

image

oCalendar is a jQuery plugin that allows you to add an event calendar to your sites or projects easily. You can add, edit and delete events from the client side.

MORE INFO by CodeCanyon (premium plugin)

22. jMonthCalendar

jomonth

jMonthCalendar is a full month jquery Calendar that supports events. You simply initialize the calendar with options and an events array and it can handle the rest. The plugin does have extension points that allow the developer to interact with the calendar when the display is about to change months, after the display has changed months and when the event bubbles are clicked on. jMonthCalendar now supports hover extension points, hover over an event and trigger an event like an alert(); By default the events would each have a URL supplied that would link to a details page.

23. JSCalendar

image

JSCalendar is a Javascript class that adds accessible and unobtrusive date-pickers to your form elements. By using it, you can set up the coolest calendar in the shortest amount of time. MORE INFO / DEMO by CodeCanyon (premium plugin)

24. jQuery Calendar date picker plug-in

jquery-datepicker

allows you to easily add “date picker” calendars to you HTML forms. These calendars make it much quicker, easier and less error prone for people to input certain types of dates.

25. ClockPick

clockpick

26. Simple JQuery Date Picker

image

Pretty neat jquery Calendar datepicker which works on one or more text input elements and is easy styled with CSS. It is very easy to use this datepicker – just choose your year and month first and then pick some day

27. FullCalendar

full calendar

FullCalendar is a famous jQuery calendar plugin which offers features like drag-and-drop, integration with Google Calendar and able to fetch events through JSON. Designers can easily customize the look and feel of the calendar, while developers can utilize the exposed hooks for user-triggered events

28. Sexy jQuery Multiday Calendar Datepicker Plugin – jCal

sexy-jquery-multiday-calendar

jCal allows for a sequence of months to reside side by side and for the user to select a number of consecutive days.

29. BlueShoes JS DatePicker Component

blueshoes

The DatePicker lets users easily select valid dates from a dropdown calendar. No need to worry about date formats, by picking dates it’s always correct.

30. jCalendar

jcal

jCalendar is an inline dynamic calendar built with jQuery. It originally started off based on the great jquery Calendar date picker by Kelvin Luck but has quickly morphed into its own code base.

31. Timeframe

timeframe

Click-draggable. Range-makeable.

32. iCal-like calendar

ical

According to Stefano Verna’s web designer experience, one of the most common requests from clients when it comes to WordPress personalization, is to add a basic event calendar to their website.

33. jQuery Time Picker

time-picker

Improve your forms with this usable and easy to deploy jQuery time picker.

MORE INFO / DEMO by CodeCanyon (premium plugin)

34. timeago a jQuery plugin

timeago

Timeago is a jQuery plugin that makes it easy to support automatically updating fuzzy timestamps (e.g. “4 minutes ago” or “about 1 day ago”).