Javascript

Kalendae - A Framework Independent Javascript Date Picker

Written by Kevin Liew on 09 Apr 2012
20,469 Views • Shares
7 comments

Introduction

Kalendae is a robust javascript framework independent date picker plugin that really does a great job. If you didn't want to use the jQuery UI datepicker, here is a great alternative for you. Kalendae comes with many configurations, functions, events and properties just to give you the flexibility to create the date picker you want. It's bundled with a powerful date handling javascript plugin - moment.js to process and format dates.

Features

  • Fully portable, no dependencies. No jQuery, no Prototype, no MooTools; just add the script and the stylesheet and you're good to go.
  • Fully and easily skinable. The default theme uses only one image file (a mask for the previous and next buttons), everything else is styled using CSS.
  • Support single day, multiple day, or day range selection.
  • Configurable number of months to be displayed at once.
  • Can be displayed on the page as an inline widget, or attached to one or more input fields as a popup control.
  • Can be attached to any page element, not just named elements.
  • Configurable blackouts, defined either as an array of dates or via a callback function
  • Output selected dates in a variety of formats
  • Leverages moment.js for smart and easy date parsing.

Screenshots

Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.

7 comments
Dominic Myers 4 years ago
Brilliant script!! I need to parse and return dates using YYYY-MM-DD format, I've looked at the moment.js documentation but I'm non the wiser. Any help greatly appreciated.
Reply
Kevin Liew Admin 4 years ago
Hi Dominic, I haven't used it as well. Looking at the documentation, in the Advanced Behavior Option, I think this option is what you'll need: dayAttributeFormat
Reply
Dhruv 7 months ago
how can i block some dates of calander which i want
Reply
scott 4 years ago
Thanks, this is really easy to use
Reply
ron 4 years ago
Nice script but the calender doesn't close when a date is selected or when you click on the "X" in the upper right. I have to click off the calendar to close it. Can you give me some script to close the calendar when date is selected? Thank you.
Reply
huang 3 years ago
I am sorry ,but how can I get it?
Reply
Luiz Henrique 2 years ago
Why is october all "cagado de azul" ?
Reply