[ Mini Kiebo ]
Server: Windows NT DESKTOP-5B8S0D4 6.2 build 9200 (Windows 8 Professional Edition) i586
Path:
D:
/
xampp182
/
htdocs
/
simpeg
/
zapatec
/
zpcal
/
zpcal
/
demo
/
[
Home
]
File: example92.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <meta name="description" content=" Click the '...' button to display the calendar. Notice that you can set the time at the bottom of the calendar. You cannot select Sundays. Select any Friday of the month. On Fridays you cannot set times earlier than 08:00 and later than 21:45. On Saturdays you can set only times between 11:00 and 17:00. Select any day of the month except Friday, Saturday or Sunday. You can set any time you want. Set the time to 23:00, and change the day to a Saturday. Notice that the time automatically scrolls past 11:00, since that is the earliest valid time for that day. "> <meta name="keywords" content="dhtml tools,javascript,DHTML Tools,Javascript,ajax,AJAX,Ajax,ajax tools,AJAX Tools,tools controls,simple javascript tools"> <title>Zapatec DHTML Calendar Widget - Limit Time and Day Selection</title> <!-- Common JS files --> <script type='text/javascript' src='../../utils/zapatec.js'></script> <!-- Custom includes --> <!-- import the calendar script --> <script type="text/javascript" src="../src/calendar.js"></script> <!-- import the language module --> <script type="text/javascript" src="../lang/calendar-en.js"></script> <!-- other languages might be available in the lang directory; please check your distribution archive. --> <!-- ALL demos need these css --> <link href="../../website/css/zpcal.css" rel="stylesheet" type="text/css"> <link href="../../website/css/template.css" rel="stylesheet" type="text/css"> <style type="text/css"> body { width: 778px; } </style> <!-- Theme css --> <link href="../themes/wood.css" rel="stylesheet" type="text/css"> <link rel="SHORTCUT ICON" href="http://www.zapatec.com/website/main/favicon.ico"> </head> <body> <div class='zpCalSubHeader' style='text-align:center;'>Limit Time and Day Selection</div> <div class='zpCalDemoText'> <ul> <li>This demo uses the <b>wood theme</b>.</li> <li> Click the '...' button to display the calendar. Notice that you can set the time at the bottom of the calendar.</li> <li> You cannot select Sundays.</li> <li> Select any Friday of the month. </li> <li>On Fridays you cannot set times earlier than 08:00 and later than 21:45.</li> <li> On Saturdays you can set only times between 11:00 and 17:00.</li> <li> Select any day of the month except Friday, Saturday or Sunday.</li> <li> You can set any time you want. </li> <li> Set the time to 23:00, and change the day to a Saturday. Notice that the time automatically scrolls past 11:00, since that is the earliest valid time for that day.</li> </ul> </div> <b>Date :</b> <input type="text" name="date9" id="sel9" size="30"> <input type="reset" value=" ... " id='button9' onclick="setActiveStyleSheet(this, 'win2k-1');"> <script type="text/javascript"> <!-- to hide script contents from old browsers function timeOutOfRange(date, year, month, day, hours, minutes) { if (date.getDay() == 0) { //No Sunday return true; } if (typeof(hours) != "undefined") { if (date.getDay() == 6) { //only allow 11AM to 5PM on Saturday if ((hours < 17 || hours==17 && minutes==0) && hours >= 11) { return false; } else { return true; } } //on saturdays allow if (date.getDay() == 5) { //only allow 8AM to 9:45PM on Friday if (hours > 21 || hours < 8) { return true; //not within the hours } if (hours != 21) { return false; //within the hours } //hours = 21 if (minutes <= 45) { return false; } else { return true; } } } return false; } // end hiding contents from old browsers --> </script> <script type="text/javascript"> var cal = new Zapatec.Calendar.setup({ inputField : "sel9", // id of the input field singleClick : false, // require two clicks to submit ifFormat : '%a, %b %e, %Y [%H:%M]', // format of the input field showsTime : true, // show time as well as date button : "button9", // trigger button dateStatusFunc : timeOutOfRange }); </script> <noscript> <br/> This page uses an <a href='http://www.zapatec.com/website/main/products/suite/'> AJAX Component</a> - Zapatec DHTML Calendar Widget, but your browser does not support Javascript. <br/> <br/> </noscript> <br/><br/><br/> <div class="footer" style='width: 778px; text-align:center; margin-top:2em'> © 2004-2007 <strong> <a href='http://www.zapatec.com/'>Zapatec, Inc.</a> </strong> </div> </body> </html>