Joomla :: Hide past days from calendar control
Open /media/system/js/calendar-setup.js file and perform the following updates. Please make sure that this update will reflect the change in whole site(admin & front).
1. Replace the following code
param_default(“disableFunc”,null); WITH param_default(“disableFunc”,disableDate);
AND Place the below function just before the last curly bracket and semicolon(i.e. };)
function disableDate(d)
{
tdy = new Date();
diff = d – tdy;
dys = Math.round(diff/(1000*60*60*24));
if (dys > -1)
return false;
return true;
}
2. First of all I had tried it using the following code to display calendar at one of my front site page but the functionality to hide the past days doesn’t work there. However, it was working perfectly at admin area.
<input type=”text” name=”date_of_appointment” id=”date_of_appointment” size=”25″ maxlength=”25″ value=”" readonly=”true” />
<input type=”reset” value=”…” onclick=”return showCalendar(‘date_of_appointment’,'%Y-%m-%d’);” />
Reason: above code will not call calendar-setup.js file where we’ve made the changes to hide the past days from calendar. It directly calls calendar.js file located at /media/system/js directory. Obviously at admin, it works because admin site calendar behavior uses calendar-setup.js file.
3. Solution:
To get it worked exactly like admin, I’ve used the following code to display the calendar control on my front side page.
<?php
$document = & JFactory::getDocument();
$document->addScript(“includes/js/joomla.javascript.js”);
JHTML::_(‘behavior.calendar’);
echo JHTML::_(‘calendar’,”, ‘date_of_appointment’, ‘date_of_appointment’, ‘%Y-%m-%d’, array(‘class’=>’inputbox’, ‘size’=>’8′, ‘maxlength’=>’19′));
?>
It works fine now @both: admin & front side as well!!
Additional tasks:
Disable all past dates
function disableDate(d)
{
today = new Date();
difference = d – today;
days = Math.round(difference/(1000*60*60*24));
if( days > -1 )return false;
return true;
}
Now replace the following code from calendar-setup.js
param_default(“disableFunc“, null) ;
to param_default(“disableFunc“, disableDate) ;
Enable Only Specific Day
function disableDate(d)
{
// Enable only Monday of all months
if( d.getDay()==1 ) return false ;
return true ;
}
Since the changes in
param_default(“disableFunc”, null);
in calendar-setup.js will reflect to all the date fields in your site pages, in order to reflect the customization in specific date field modify above callback function to
if (params.inputField==”custom_date”)
param_default(“disableFunc“,disableDate);
else
param_default(“disableFunc“,null);
Note: custom_date is my date text filed name
Solution to make it specific(i.e not to change at admin & front together):
if(params.inputField==’date_of_appointment’) param_default(“disableFunc”,disableDate); else param_default(‘disableFunc’,null);
No trackbacks yet.