Narayan Vaidyanathan

  • Wanna feel my punch?

    Check out my creative and interesting projects.

    I specialize in creating usable designs for the web with a professional approach and convert them into HTML 4 & 5 / CSS with Open Source Themes

Javascript Date and Time Calendar

Date and time calendar is supporting from older IE browsers.

Here Step by Step instruction to implement with your existing code or simply

and use it.

include following javascript files in head part.


<!-- Date and time picker -->
<script src="js/datetimepicker.js"></script>

call calendar functions in onclick or onfocus as per following syntex


calendar javascript holding lot of different method of calling calendar function as below

1. Date Format : MM-dd-YYYY

onclick="javascript:NewCssCal ('demo1')"

2. with differnent date format

onclick="javascript:NewCssCal ('demo2','ddMMyyyy')"

3. Date format with feature date

onclick="javascript:NewCssCal ('demo6','yyyyMMdd','','','','','future')"

4. Date format with past date

onclick="javascript:NewCssCal ('demo6','yyyyMMdd','','','','','past')"

5. Date with arrow

onclick="javascript:NewCssCal ('demo1','mmddyyyy','arrow')"

6. Date and time

onclick="javascript:NewCssCal ('demo1','MMddyyyy','dropdown',true,'12',true)"

7. Date and time with feature date

onclick="javascript:NewCssCal ('demo7','yyyyMMdd','dropdown',true,'12',true,'future')"

8. Date and time without seconds

onclick="javascript:NewCssCal ('demo1','MMddyyyy','dropdown',true,'12')"

9. Date and time with seconds

onclick="javascript:NewCssCal ('demo1','MMddyyyy','dropdown',true,'24',true)"

This blow very useful to you… see you in next post

  • Designed and Developed by Narayan
  • Like Narayan ?
    Connect with me