Here's two rough drafts of calendars created via ColdFusion (7, but I believe 6.1 would have the same functionality).
Tables-based
<cfparam name="URL.CalendarMonth" default="#Month(now())#" type="integer" />
<cfparam name="URL.CalendarYear" default="#Year(now())#" type="integer" />
<cfif URL.CalendarMonth LT 1 OR URL.CalendarMonth GT 12>
<cfset URL.CalendarMonth = Month(now()) />
</cfif>
<cfset VARIABLES.Calendar.StartDate = CreateDate(URL.CalendarYear, URL.CalendarMonth, 1) />
<table style="width:375px;" summary="Calendar of events for <cfoutput>#DateFormat(VARIABLES.Calendar.StartDate, 'mmmm yyyy')#</cfoutput>.">
<thead>
<tr>
<th colspan="7"><cfoutput>#DateFormat(VARIABLES.Calendar.StartDate, "mmmm yyyy")#</cfoutput></th>
</tr>
<tr>
<th>S</th>
<th>M</th>
<th>T</th>
<th>W</th>
<th>Th</th>
<th>F</th>
<th>S</th>
</tr>
</thead>
<tbody>
<cfloop from="1" to="#DaysInMonth(VARIABLES.Calendar.StartDate)#" index="iDay">
<cfset VARIABLES.Calendar.CurrentDate = CreateDate(URL.CalendarYear, URL.CalendarMonth, iDay) />
<cfif DayOfWeek(VARIABLES.Calendar.CurrentDate) EQ 1 OR iDay EQ 1><!--- This is Sunday, or the first day. --->
<tr>
</cfif>
<cfif iDay EQ 1><!--- If it's the first day, determine how many empty cells we need. --->
<cfoutput>#RepeatString("<td></td>", DayOfWeek(VARIABLES.Calendar.StartDate) - 1)#</cfoutput>
</cfif>
<cfoutput><td><span title="#DateFormat(VARIABLES.Calendar.CurrentDate, 'mmmm d, yyyy')#">#iDay#</span></td></cfoutput>
<cfif iDay EQ DaysInMonth(VARIABLES.Calendar.StartDate)>
<cfoutput>#RepeatString("<td></td>", 7 - DayOfWeek(VARIABLES.Calendar.CurrentDate))#</cfoutput>
</cfif>
<cfif DayOfWeek(VARIABLES.Calendar.CurrentDate) EQ 7 OR iDay EQ DaysInMonth(VARIABLES.Calendar.StartDate)><!--- This is Saturday, or the last day. --->
</tr>
</cfif>
</cfloop>
</tbody>
</table>
Ordered list and CSS
The following is a rough version of an ordered list and CSS-based calendar.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type="text/css">
.olCalendar {
width:375px;
}
.olCalendar ol li {
display:block;
float:left;
list-style-position:inside;
margin:0;
width:45px;
}
.olCalendar li.noDate {
list-style-image:none;
}
</style>
</head>
<body>
<cfparam name="URL.CalendarMonth" default="#Month(now())#" type="integer" />
<cfparam name="URL.CalendarYear" default="#Year(now())#" type="integer" />
<cfif URL.CalendarMonth LT 1 OR URL.CalendarMonth GT 12>
<cfset URL.CalendarMonth = Month(now()) />
</cfif>
<cfset VARIABLES.Calendar.StartDate = CreateDate(URL.CalendarYear, URL.CalendarMonth, 1) />
<div class="olCalendar">
<ol start="<cfoutput>#2 - DayOfWeek(VARIABLES.Calendar.StartDate)#</cfoutput>">
<cfloop from="1" to="#DaysInMonth(VARIABLES.Calendar.StartDate)#" index="iDay">
<cfset VARIABLES.Calendar.CurrentDate = CreateDate(URL.CalendarYear, URL.CalendarMonth, iDay) />
<cfif iDay EQ 1><!--- If it's the first day, determine how many empty cells we need. --->
<cfoutput>#RepeatString('<li class="noDate"> </li>', DayOfWeek(VARIABLES.Calendar.StartDate) - 1)#</cfoutput>
</cfif>
<cfoutput><li class="#LCase(DayOfWeekAsString(DayOfWeek(VARIABLES.Calendar.CurrentDate)))#"><span title="#DateFormat(VARIABLES.Calendar.CurrentDate, 'mmmm d, yyyy')#">#iDay#</span></li></cfoutput>
<cfif iDay EQ DaysInMonth(VARIABLES.Calendar.StartDate)>
<cfoutput>#RepeatString('<li class="noDate"> </li>', 7 - DayOfWeek(VARIABLES.Calendar.CurrentDate))#</cfoutput>
</cfif>
</cfloop>
</ol>
</div>
</body>
</html>
But, let's be honest, this version sucks. I think tables are a necessary evil in this regard.
EDIT 12/21/2009: Corrected StartDate/CurrentDate mistake with repeating td elements.
Subscribe