Skip to content

This is a small prototype for a date picker widget that is suited for templates and for browsers which do not support the advanced features it needs (CSS, DOM Level 2, JavaScript enabled). It is intended to be as unintrusive to your templates as possible, currently it requires that you put your date edit widgets into a span together with the link to open the date picker.

Date picker #1: ...

Unfortunately the iframe used to display the date picker cannot be created dynamically on demand, as the loading of the iframe content would possibly take too long.

Date picker #2, moved over : ...

This is an early release of the date picker and only has been tested against IE6 and Mozilla/Phoenix. I won't bother to backport it to NS4 or IE5, but if you provide me with small patches for recent versions of Opera and Safari, I'll see what I can do to incorporate these. The code is released under the artistic license.

To use the calendar, modify your page like this:

<!-- This is needed to hide the div containing the date picker. -->
<style type="text/css">
div.calendar_widget { position: absolute; float: left; top: 0px; left: 0px; width:140px; height: 200px; display: none; }
</style>
<script type="text/javascript" src="date-picker.js"></script>

<!-- Your original page content goes here -->

<!-- This picker should go to the end of your page template -->
<div class="calendar_widget" id="calendar_widget">
<iframe id='calendar_widget_iframe' name='calendar_widget_iframe' style="border: none;" width=100% height=100% src="calendar_widget.html"></iframe></div>

If this dosen't work look at the source of this page.