Auto Date: JavaScript based Autocomplete Date selector

Input Date Known Interface

If we talk about the date interfaces on web. There are only couple of them with easy customization as per use-case.

  • Calendar JS plugin

    Calendar image

    Calender based JS plugin http://www.dynarch.com/projects/calendar/

  • Seperate DD MM YYYY
  • Full Calendar

One might have used some decent date interfaces on some Desktop clients e.g. Omnifocus (Mac) is one having powerful date time selector with sleek interface. To be true, after using it we at EnTrip felt to design something for WEB2.0, something sleek, basic, fast and responsive date selector instead of Calender date selector or conventional interfaces.

Download

Auto-Date is hosted at google code and code can be downloaded from here. Unzip the files and go through the README file and open index.html

Javascript Autocomplete Date Selector

Javascript Autocomplete Date Selector

Demo

Enter the date in any format. Currently year is in YY, so to enter 2030 you need to type 30 only.

Here is the Demo of the plugin to try out

About Auto-Date

Auto Date v1.0.2 is an amazingĀ JS based auto-complete date selector under MIT-LICENSE which uses the Prototype Framework. Its an alternative to calender interface in browser which sounds annoying when one needs to enter future/past dates.

It validates the date before displaying the possible options. It make sure by prompting which date is popping up in your mind. Say for example one types “01/05” it prompts 05 jan or 01 May. Sounds great!

It also understand certain literals as one usually writes in day to day communication e.g today, yesterday, tomorrow, coming weekend, new year, christmas, last month, saturday etc.

Acceptable Date Formats


  • DD MM YY (seperator can be space ” ” , comma “,” , period “.”, forward slash “/”)


    dd mm yy format

    dd mm yy or mm dd yy format

  • MM DD YY (seperator can be space ” ” , comma “,” , period “.”, forward slash “/”)
  • DD MON YY (MON can be (jan/feb/mar etc), seperator can be space ” ” , comma “,” , period “.”, forward slash “/”)


    Month dd yy format

    Mon dd yy or dd Mon yy format

  • MON DD YY (MON can be (jan/feb/mar etc), seperator can be space ” ” , comma “,” , period “.”, forward slash “/”)
  • New year 1 Jan <present year>
  • Christmas 25 Dec <present year>
  • Monday/Tuesday/Wednesday/Thrusday/Friday/Saturday/Sunday (all are coming ones, instead of present week)
  • Weekend/Week
  • Next Month/ Last Month/ Last week/ last weekend/ last sunday/ last monday etc
  • Today/Tomorrow/Yesterday


    Today Tomorrow Yesterday

    Today Tomorrow Yesterday Format

So just start typing and its fast autocomplete feature will take your heart away. Best of all, its all client side so no burden on your server.

Features


  1. Based on Javascript Prototype Library
  2. Multiple Date Format Support
  3. Support for multiple Date Separator.
  4. ONLY_FUTURE_DATE feature. Just set it to true when its called
  5. Literal Support, just by typing some characters
  6. Auto-Complete, it auto-completes as you start typing and show possible options
  7. Support only from 1970 to 2069

    ONly Future Date Support

    Support for ONLY_FUTURE_DATE

    Multiple Date format Support

    Multiple Date Separator Support

For feedback, suggestion, source code or contribution check out auto-date google code