Picker Mini

Welcome to DatePicker, a collection of Native JavaScript Classes to display calendar to collect or set events. You can try it bellow!

Called from plain input, creates and opens a Mini calendar.
Click on any day to collect selected day.

<input type="text" id="calendarID" value="" placeholder="Start today" autocomplete="off" />

new DatePickerMini(calendarID);

Setup DatePicker Mini

  • This date picker is the smallest Class from collections,
    just 6.452 bytes, Uncompressed and Unminify!
  • Does only one work, by picking any day puts this day in selected input with format YYYY-MM-DD.
  • Setup is very straightforward.
    Include datepicker-mini.css and datepicker-mini.js in HTML,
    add an input with ID and call Class with this ID.
  • Note: you don’t need to add any quotes,
    i.e DatePickerMini(inputid);
  • The only things that you may need to setup manually is to change the values _dayNames and _monthNames to preferred language,
    and the values _yearStart and _yearEnd
  • Those define when start a calendar and when end.
    For example: if you want to select days only from this year set _yearStart and _yearEnd to 0


Those scripts builded as ECMAScript classes.
Before you use them please read if you can use javascript ES6 and above.
Or read more details for ES 2016 plus.
Cherry on top, forgot older browsers like I.E, edge18, etc.


Free to public. Do whatever you like with those Scripts.
Dig on code and do your magic to make it better.
Or make something new for your needs.
If you use it or if you like it, spread it to world, and if you are in good mood give us a backlink!

CC0 Free to public