meechp123
asked on
Adjusting the position of a Javascript Calendar
I am using this calendar (http://www.dynarch.com/demos/jscalendar/) to pass events to a Coldfusion page.
The calendar for my site is located here: http://www.barreport.com/publicsite/viewevents/jscalendar2.cfm
You click on a date and it shows the events for that date.
Now, my only issue is a stupid one, I would like to place the calendar into the table that's displayed on the link above. The only thing is that it's a royal pain in the ass to simply move the calendar and place it into the table.
I've read the documentation, but, I still cant seem to move the calendar around.
The calendar for my site is located here: http://www.barreport.com/publicsite/viewevents/jscalendar2.cfm
You click on a date and it shows the events for that date.
Now, my only issue is a stupid one, I would like to place the calendar into the table that's displayed on the link above. The only thing is that it's a royal pain in the ass to simply move the calendar and place it into the table.
I've read the documentation, but, I still cant seem to move the calendar around.
<!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=utf-8" />
<title>view events JSCalendar</title>
<!---Calendar JS--->
<!-- main calendar program -->
<script type="text/javascript" src="../../Scripts/jscalendar-1.0/calendar.js"></script>
<!-- language for the calendar -->
<script type="text/javascript" src="../../Scripts/jscalendar-1.0/lang/calendar-en.js"></script>
<!-- the following script defines the Calendar.setup helper function, which makes
adding a calendar a matter of 1 or 2 lines of code. -->
<script type="text/javascript" src="../../Scripts/jscalendar-1.0/calendar-setup.js"></script>
<link href="../../Scripts/jscalendar-1.0/calendar-win2k-1.css" rel="stylesheet" type="text/css" />
<!---END OF Calendar--->
</head>
<body>
<table width="100" border="1" >
<tr>
<td id="calendar-container">
<script type="text/javascript">
function dateChanged(calendar) {
// Beware that this function is called even if the end-user only
// changed the month/year. In order to determine if a date was
// clicked you can use the dateClicked property of the calendar:
if (calendar.dateClicked) {
// OK, a date was clicked, redirect to /yyyy/mm/dd/index.php
var y = calendar.date.getFullYear();
var m = calendar.date.getMonth(); // integer, 0..11
var d = calendar.date.getDate(); // integer, 1..31
// redirect...
window.location = "calendarEvents.cfm?eventDate=" + (m+1) + "/" + d + "/" + y;
}
};
Calendar.setup(
{
flat : "calendar-container", // ID of the parent element
flatCallback : dateChanged // our callback function
}
);
</script>
</td>
</tr>
</table>
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER