YUI Calendar Dates not Highlighting
Jul 5, 2010 9:21 AM
I'm very new to the YUI Calendar and have been successful in getting it installed and setup with a DataSet based upon 'fixed_date1' in my dbase table, but I cannot get my calendar to highlight the reserved dates. Plus, the message "There are no events scheduled on this date." displays even when there is a reservation on the calendar.
My code:
<body id="calendar">
<div id="bkgrd">
<div id="body-center" class="group">
<div id="bg-header">
<div id="cv-body">
<div id="bread">
<ul>
<li><a href="index.php">Home ></a></li>
<li>Event Calendar</li>
</ul></div>
<div id="header">
<?php include('incs/header_2nd.php'); ?>
</div>
<div id="column-left">
<?php include('left_navmenu.php'); ?>
</div>
<div id="column-right">
<div class="right-padd">
<h1>Event Calendar</h1>
<div class="conpadd">
<div id="yuicalendar1"></div>
<script type="text/javascript">
// BeginWebWidget YUI_Calendar: yuicalendar1
(function() {
var cn = document.body.className.toString();
if (cn.indexOf('yui-skin-sam') == -1) {
document.body.className += " yui-skin-sam";
}
})();
var inityuicalendar1 = function() {
var yuicalendar1 = new YAHOO.widget.Calendar("yuicalendar1");
// The following event subscribers demonstrate how to handle
// YUI Calendar events, specifically when a date cell is
// selected and when it is unselected.
//
// See: http://developer.yahoo.com/yui/calendar/ for more
// information on the YUI Calendar's configurations and
// events.
//
// The YUI Calendar API cheatsheet can be found at:
// http://yuiblog.com/assets/pdf/cheatsheets/calendar.pdf
//
//--- begin event subscribers ---//
yuicalendar1.selectEvent.subscribe(selectHandler, yuicalendar1, true);
yuicalendar1.deselectEvent.subscribe(deselectHandler, yuicalendar1, true);
//--- end event subscribers ---//
yuicalendar1.render();
}
function selectHandler(event, data) {
var formattedDateString = data[0][0][1] + "/" + data[0][0][2] + "/" + data[0][0][0];
var r = dsCourses.findRowsWithColumnValues({"Date": formattedDateString }, true);
var region = Spry.Data.getRegion("classDetail");
if(r){
dsCourses.setCurrentRow(r.ds_RowID);
region.setState("showClass", true);
} else {
region.setState("ready", true);
}
// The JavaScript function subscribed to yuicalendar1. It is called when
// a date cell is selected.
//
// alert(event) will show an event type of "Select".
// alert(data) will show the selected date as [year, month, date].
};
function deselectHandler(event, data) {
// The JavaScript function subscribed to yuicalendar1. It is called when
// a selected date cell is unselected.
};
// Create the YUI Calendar when the HTML document is usable.
YAHOO.util.Event.onDOMReady(inityuicalendar1);
// EndWebWidget YUI_Calendar: yuicalendar1
</script>
<div spry:detailregion="dsCourses" id="classDetail">
<div spry:state="showClass">
<table width="500" border="0" cellspacing="0" cellpadding="0">
<tr>
<th scope="col"> </th>
<th scope="col"> </th>
</tr>
<tr>
<td>{DATE}</td>
<td>{EVENT}</td>
</tr>
</table></div>
<div spry:state="ready">
There are no events scheduled on this date.</div>
</div>
<table width="500" border="0" cellspacing="0" cellpadding="0" id="classSched">
<tr>
<th scope="col">DATE</th>
<th scope="col">EVENT</th>
</tr>
<?php do { ?>
<tr>
<td><?php echo $row_getList['date']; ?></td>
<td><?php echo $row_getList['event_type']; ?></td>
</tr>
<?php } while ($row_getList = mysql_fetch_assoc($getList)); ?>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="footer">
<?php include('footer.php'); ?>
</div>
</body>
Also, it seems after I installed the calendar, it has modified all of the styles within the text of the page, which it shouldn't.
I could really use some help with this Widget if someone can spare some time.
Thank you.
