|
|
|
A sample calendar, check it out:
The calling form (index.php):
| <html>
<head>
</head>
<body>
<form name="frmMain" method="post">
Date: <input type="text" name="txtDate" value="mm/dd/yyyy" size="15" maxlength="10">
<input type="button" name="cmdCal" value="Launch Calendar" onClick='javascript:window.open("calendar.php?form=frmMain&field=txtDate","","top=50,left=400,width=175,height=140,menubar=no,toolbar=no,scrollbars=no,resizable=no,status=no"); return false;'>
</form>
</body>
</html> | |
The calendar php script (calendar.php):
| <?php
// Get values from query string
$day = $_GET["day"];
$month = $_GET["month"];
$year = $_GET["year"];
$sel = $_GET["sel"];
$what = $_GET["what"];
$field = $_GET["field"];
$form = $_GET["form"];
if($day == "") $day = date("j");
if($month == "") $month = date("m");
if($year == "") $year = date("Y");
$currentTimeStamp = strtotime("$year-$month-$day");
$monthName = date("F", $currentTimeStamp);
$numDays = date("t", $currentTimeStamp);
$counter = 0;
/*$numEventsThisMonth = 0;
$hasEvent = false;
$todaysEvents = "";*/
?>
<html>
<head>
<title>MyCalendar</title>
<link rel="stylesheet" type="text/css" href="calendar.css">
<script language="javascript">
function goLastMonth(month,year,form,field)
{
// If the month is January, decrement the year.
if(month == 1)
{
--year;
month = 13;
}
document.location.href = 'calendar.php?month='+(month-1)+'&year='+year+'&form='+form+'&field='+field;
}
function goNextMonth(month,year,form,field)
{
// If the month is December, increment the year.
if(month == 12)
{
++year;
month = 0;
}
document.location.href = 'calendar.php?month='+(month+1)+'&year='+year+'&form='+form+'&field='+field;
}
function sendToForm(val,field,form)
{
// Send back the date value to the form caller.
eval("opener.document." + form + "." + field + ".value='" + val + "'");
window.close();
}
</script>
</head>
<body style="margin:0px 0px 0px 0px" class="body">
<table width='175' border='0' cellspacing='0' cellpadding='0' class="body">
<tr>
<td width='25' colspan='1'>
<input type='button' class='button' value=' < ' onClick='<?php echo "goLastMonth($month,$year,\"$form\",\"$field\")"; ?>'>
</td>
<td width='125' align="center" colspan='5'>
<span class='title'><?php echo $monthName . " " . $year; ?></span><br>
</td>
<td width='25' colspan='1' align='right'>
<input type='button' class='button' value=' > ' onClick='<?php echo "goNextMonth($month,$year,\"$form\",\"$field\")"; ?>'>
</td>
</tr>
<tr>
<td class='head' align="center" width='25'>S</td>
<td class='head' align="center" width='25'>M</td>
<td class='head' align="center" width='25'>T</td>
<td class='head' align="center" width='25'>W</td>
<td class='head' align="center" width='25'>T</td>
<td class='head' align="center" width='25'>F</td>
<td class='head' align="center" width='25'>S</td>
</tr>
<tr>
<?php
for($i = 1; $i < $numDays+1; $i++, $counter++)
{
$timeStamp = strtotime("$year-$month-$i");
if($i == 1)
{
// Workout when the first day of the month is
$firstDay = date("w", $timeStamp);
for($j = 0; $j < $firstDay; $j++, $counter++)
echo "<td> </td>";
}
if($counter % 7 == 0)
echo "</tr><tr>";
if(date("w", $timeStamp) == 0)
$class = "class='weekend'";
else
if($i == date("d") && $month == date("m") && $year == date("Y"))
$class = "class='today'";
else
$class = "class='normal'";
echo "<td class='tr' bgcolor='#ffffff' align='center' width='25'><a class='buttonbar' href='#' onclick=\"sendToForm('".sprintf("%02d/%02d/%04d", $month, $i, $year)."','$field','$form');\"><font $class>$i</font></a></td>";
}
?>
</tr>
</table>
</body>
</html> | |
Want the CSS?
Here it is (calendar.css):
| .body {
font-family: Verdana;
background-color : #ACACAC;;
}
.tr {
background-color : #ACACAC;
}
.th {
font-family: Verdana;
}
a.buttonbar:link, a.buttonbar:visited {
font-size : 9px;
padding-top : 1px;
padding-bottom : 1px;
text-decoration : none;
background-color : #ACACAC;
color : #FFFFFF
}
a.buttonbar:hover {
padding-top : 1px;
padding-bottom : 1px;
background-color : #CCCCCC;
color : #FFFFFF
}
.normal {
font-family: Verdana;
font-size: 8pt;
color: #000000;
}
.today {
font-family: Verdana;
font-size: 8pt;
font-weight:bold;
color:#000066;
background-color: #CACACA;
}
.weekend {
font-family: Verdana;
font-size: 8pt;
color:#FF0000;
}
.selected {
font-family: Verdana;
font-size: 8pt;
color: #FFFFFF;
background-color: #C00000;
}
.event {
font-family: Verdana;
font-size: 8pt;
color: #000000;
background-color: #C6D1DC;
}
.head {
color:#CCCCCC;
font:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:500;
background-color:#000066;
}
.title {
color:#000066;
font:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
}
.button {
font-family : Verdana, Arial, Helvetica, sans-serif;
font-style : normal;
font-weight : bold;
font-size : 10px;
color : #000000;
background-color : #F0F0F0;
border : 1px solid #000066;
} | |
If there is any comments or suggestions, feel free to email me @ warren.gutierrez@gmail.com..... ('',)
Enjoy! |
|
| Calendars to choose a range of dates , reservation events ... Categories : PHP, Calendar, Java Script, Date Time | | | enhanced date picker with jcript checking for a dynamic date input Categories : PHP, Java Script, Date Time, Calendar, Arrays | | | Simple PHP control CSS Calender Categories : PHP, HTML and PHP, Calendar, Date Time, CSS | | | Higly Customizable Javascript Calendar Script Categories : Java Script, Calendar, Date Time, HTML, CSS | | | pcCalendar class - Allows for the creation of calendars in HTML pages. All output functions can be easily overridden, refer to article 1471 for an example.
Categories : PHP, Date Time, Calendar, PHP Classes | | | Simple Javascript CSS Digital Clock Categories : Java Script, Date Time, CSS, Beginner Guides, Web Design | | | A simple and fast calendar combining PHP and tables. Use this as a base for applications in which a calendar is needed. Categories : Date Time, PHP, Complete Programs, Calendar | | | Example of using the pcCalendar class, article 1468 on weberdev.com. Calendar example. Categories : PHP, Date Time, PHP Classes, Calendar | | | Functions used to define a schedule of holidays. Can define non-fixed holidays (eg. 3rd sunday of June). Categories : Calendar, Date Time, PHP | | | Monthly and Daily Upcoming Events calendar. Categories : Date Time, PostgreSQL, PHP, Calendar, Databases | | | CALENDAR - easy calendar-navigation with PHP Categories : PHP, Date Time, HTML and PHP, Calendar | | | A PHP Calendar function with CSS : add a cool calendar to any php page by just adding a calendar class based function. Categories : PHP, PHP Classes, Calendar, Date Time | | | This script contains 2 functions: 1 to create html select object based on your own customer date format entry- "M d Y h:i.... etc". The second function processes the select object on submit back to unix time. Categories : PHP, Calendar, Date Time, HTML and PHP | | | Shows the current time as a PNG-image. This script does not use the GD
library. You can use it as a benchmark (because it's slow), or as a quick
reference for implementing a simple PNG-file generator. Categories : Graphics, Zlib, Calendar, PHP, Date Time | | | Kewl Date Example Categories : PHP, HTML and PHP, Date Time, CSS, Beginner Guides | |
| | | | Max Kipness wrote :1346
This did not seem to work because you were not checking to see if the variables were set in index.php. I`ve corrected this and now the code worked. Other than that it works good.
Revised index.php
<?php
// Get values from query string
if (isset($_GET["day"])) $day = $_GET["day"];
if (isset($_GET["month"]))$month = $_GET["month"];
if (isset($_GET["year"]))$year = $_GET["year"];
if (isset($_GET["sel"]))$sel = $_GET["sel"];
if (isset($_GET["what"]))$what = $_GET["what"];
if (isset($_GET["field"]))$field = $_GET["field"];
if (isset($_GET["form"]))$form = $_GET["form"];
if (!isset($day)) $day = date("j");
if (!isset($month)) $month = date("m");
if (!isset($year)) $year = date("Y");
$currentTimeStamp = strtotime("$year-$month-$day");
$monthName = date("F", $currentTimeStamp);
$numDays = date("t", $currentTimeStamp);
$counter = 0;
/*$numEventsThisMonth = 0;
$hasEvent = false;
$todaysEvents = "";*/
?>
<html>
<head>
<title>MyCalendar</title>
<link rel="stylesheet" type="text/css" href="calendar.css">
<script language="javascript">
function goLastMonth(month,year,form,field)
{
// If the month is January, decrement the year.
if(month == 1)
{
--year;
month = 13;
}
document.location.href = `calendar.php?month=`+(month-1)+`&year=`+year+`&form=`+form+`&field=`+field;
}
function goNextMonth(month,year,form,field)
{
// If the month is December, increment the year.
if(month == 12)
{
++year;
month = 0;
}
document.location.href = `calendar.php?month=`+(month+1)+`&year=`+year+`&form=`+form+`&field=`+field;
}
function sendToForm(val,field,form)
{
// Send back the date value to the form caller.
eval("opener.document." + form + "." + field + ".value=`" + val + "`");
window.close();
}
</script>
</head>
<body style="margin:0px 0px 0px 0px" class="body">
<table width=`175` border=`0` cellspacing=`0` cellpadding=`0` class="body">
<tr>
<td width=`25` colspan=`1`>
<input type=`button` class=`button` value=` < ` onClick=`<?php echo "goLastMonth($month,$year,\"$form\",\"$field\")"; ?>`>
</td>
<td width=`125` align="center" colspan=`5`>
<span class=`title`><?php echo $monthName . " " . $year; ?></span><br>
</td>
<td width=`25` colspan=`1` align=`right`>
<input type=`button` class=`button` value=` > ` onClick=`<?php echo "goNextMonth($month,$year,\"$form\",\"$field\")"; ?>`>
</td>
</tr>
<tr>
<td class=`head` align="center" width=`25`>S</td>
<td class=`head` align="center" width=`25`>M</td>
<td class=`head` align="center" width=`25`>T</td>
<td class=`head` align="center" width=`25`>W</td>
<td class=`head` align="center" width=`25`>T</td>
<td class=`head` align="center" width=`25`>F</td>
<td class=`head` align="center" width=`25`>S</td>
</tr>
<tr>
<?php
for($i = 1; $i < $numDays+1; $i++, $counter++)
{
$timeStamp = strtotime("$year-$month-$i");
if($i == 1)
{
// Workout when the first day of the month is
$firstDay = date("w", $timeStamp);
for($j = 0; $j < $firstDay; $j++, $counter++)
echo "<td> </td>";
}
if($counter % 7 == 0)
echo "</tr><tr>";
if(date("w", $timeStamp) == 0)
$class = "class=`weekend`";
else
if($i == date("d") && $month == date("m") && $year == date("Y"))
$class = "class=`today`";
else
$class = "class=`normal`";
echo "<td class=`tr` bgcolor=`#ffffff` align=`center` width=`25`><a class=`buttonbar` href=`#` onclick=\"sendToForm(`".sprintf("%02d/%02d/%04d", $month, $i, $year)."`,`$field`,`$form`);\"><font $class>$i</font></a></td>";
}
?>
</tr>
</table>
</body>
</html>
| |
|
|
|