Step 1: Add to header JHTML::_( 'behavior.calendar' );
<?php defined( '_JEXEC' ) or die( 'Restricted access' ); JHTML::_( 'behavior.calendar' ); // <-- this line ?>
Step 2: Add your input field and image, with correct ids <input name="entrydate" id="entrydate" type="text" /> <img class="calendar" src="/templates/system/images/calendar.png" alt="calendar" id="entrydate_img" / >
Step 3: Add Mootools javascript code
<script type="text/javascript">
window.addEvent('domready', function() {Calendar.setup({
inputField : "entrydate", // id of the input field
ifFormat : "%Y-%m-%d", // format of the input field
button : "entrydate_img", // trigger for the calendar (button ID)
align : "Bl", // alignment (defaults to "Bl" = Bottom Left,
// "Tl" = Top Left, "Br" = Bottom Right, "Bl" = Botton Left)
singleClick : true
});});
</script>
No comments:
Post a Comment