javascript calendar selector
- May 18th, 2009
- Posted in Code . Web
- By Jason Zerbe
- Write comment
I have been working on this order system over the weekend, and the one piece of it that was the most difficult to get to work, should have been the easiest. I needed a popup or inline date selector. I figured there would be a quick cut and paste way of doing this, but after trying three different (allegedly) cut and paste solution, I was still getting glitches. One of them would have worked just fine, but Internet Explorer can’t render web pages properly AT ALL! Dang you Trident rendering engine! Thankfully I finally found Matt Kruse’s Calendar Popup. Just download and include the four javascript files in your HTML document, and you are good to go. And initialize the calendar class in the header section.
<script src="PopupWindow.js" type="text/javascript"></script>
<script src="AnchorPosition.js" type="text/javascript"></script>
<script src="date.js" type="text/javascript"></script>
<script src="CalendarPopup.js" type="text/javascript"></script>
<script type="text/javascript">
var cal = new CalendarPopup();
</script>
And then to use the calendar popup selector for a certain text input:
<form>
<input name="date" type="text" />
<a id="anchor1" onclick="cal.select(document.forms['testform'].date,'anchor1','MM/dd/yyyy'); return false;" name="anchor1" href="#">Show Calendar</a>
</form>
No comments yet.