DMX|ZONE
Register Login

Forums

AJAX & JAVASCRIPT

This topic is locked

Urgent help in Javascript calendar display


cloudymegz cloudymegz
Posted 08 Jan 2006 10:00:05
1
has voted
Vote
08 Jan 2006 10:00:05 cloudymegz cloudymegz posted:
hi,

I need a urgent help..as i am stuck in this calendar javascript code. The below code generate a 12 months calendar. I know how to reduce the number of months etc but want to have a next and previous button which will display the next month. I am not able to put a next and prev month. I need to display only one month and then next or prev month is displayed by clicking on the buttons.

Please help me.

Thanks in advance


PS. code is attached







<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#FFFFFF">
<b> Current availability calendar:
<script language=JavaScript1.2 type=text/javascript>
<!--
var apartmentin="mosman";
//-->
</script>


<table dir=ltr cellspacing=1 cellpadding=1 width="100%"
border=0>
<tbody>
<tr>
<td valign=top><!--availCal_start-->
<script language=JavaScript1.2 type=text/javascript>

var apartment = apartmentin;

//Specify bgcolor of calendar
var bg="#F0EEEF"

//Specify font size
var fs=1
// table height
var tbh = 0 // 200
// table width
var tbw = 0 // 150
// cell width
var wd=10 // 22
// cell height
var ht=10 // 22
// border
var bd = 0 // 1

// available cell background
acbg = " bgcolor=#C37C50 "
// unavailable cell background
ucbg = " bgcolor=#F6A472 "

var flg = 0;

//var fs = 1;
M = new Array("January","February","March","April","May","June","July","August","September","October","November","December";
D = new Array("Sun","Mon","Tue","Wed","Thu","Fri","Sat";

function setAvailability()
{
pdy = new Date(); // today
pmo = pdy.getMonth(); // present month
pyr = pdy.getFullYear(); // present year

var j = 0;

for (var i=0; i < 12; i++)
{
if (j == 0)
document.write('<TABLE BORDER=1><TR><TD VALIGN=TOP>');
document.write('');
yr = (pmo==12?pyr+1<img src=../images/dmxzone/forum/icon_smile_tongue.gif border=0 align=middle>yr); // month's year
mo = (pmo==12?0<img src=../images/dmxzone/forum/icon_smile_tongue.gif border=0 align=middle>mo); // month
bgn = new Date(M[mo]+" 1,"+yr); // assign to date
Calendar(); // Send month to screen
if (j == 3)
{
document.write('&lt;/TD&gt;&lt;/TR&gt;&lt;/TABLE&gt;');
j = 0;
}
else
{
document.write('&lt;/TD&gt;&lt;TD VALIGN=TOP&gt;');
j++;
}
pmo++;
if (pmo == 12)
{
pmo= 0;
pyr++;
}
}
document.write('&lt;/TD&gt;&lt;/TR&gt;&lt;/TABLE&gt;'); // Finish up
}

function Calendar()
{
var rows = 0;
calendar = 1;
dy = bgn.getDay();
yr = eval(yr);
d = "312831303130313130313031";
if (yr / 4 == Math.floor(yr / 4))
{
d = d.substring(0, 2) + "29" + d.substring(4, d.length);
}
pos = (mo * 2);
ld = eval(d.substring(pos, pos + 2));
document.write("&lt;TABLE BORDER=" + bd + " cellspacing=0" + " style=border-collapse: collapse"
+ " HEIGHT=" + tbh + " WIDTH=" + tbw
+ " BGCOLOR='" + bg
+ "'&gt;&lt;TR&gt;&lt;TD ALIGN=CENTER COLSPAN=7&gt;"
+ "&lt;FONT SIZE=" + fs + "&gt;" + M[mo] + " " + yr
+ "&lt;/FONT&gt;&lt;/TD&gt;&lt;/TR&gt;&lt;TR&gt;&lt;TR&gt;";
rows++;
for (var i = 0;i &lt; 7;i ++)
{
document.write("&lt;TD ALIGN=CENTER WIDTH=" + wd + " HEIGHT=" + ht + "&gt;"
+"&lt;FONT SIZE="+fs+"&gt;" + D[i] + "&lt;/FONT&gt;&lt;/TD&gt;";
}
document.write("&lt;/TR&gt;&lt;TR&gt;";
rows++
ctr = 0;
for (var i = 0;i &lt; 7; i++)
{
if (i &lt; dy)
{
document.write("&lt;TD ALIGN=CENTER WIDTH=" + wd + " HEIGHT=" + ht + "&gt;"
+"&lt;FONT SIZE=" + fs + "&gt; &lt;/FONT&gt;"
+"&nbsp;&lt;/TD&gt;";
}
else
{
ctr++;
if (available() == 1)
{
cbg = acbg;
}
else
{
cbg = ucbg;
}
document.write("&lt;TD ALIGN=CENTER WIDTH=" + wd + " HEIGHT=" + ht + cbg + "&gt;"
+ "&lt;FONT SIZE=" + fs + "&gt;" + ctr + "&lt;/FONT&gt;"
+ "&lt;/TD&gt;";
}
}
document.write("&lt;/TR&gt;&lt;TR&gt;";
rows++;
while (ctr &lt; ld)
{
for (var i = 0;i &lt; 7; i++)
{
ctr++;
if (ctr &gt; ld)
{
document.write("&lt;TD ALIGN=CENTER WIDTH=" + wd + " HEIGHT=" + ht + "&gt;"
+ "&nbsp;&lt;/TD&gt;";
}
else
{
if (available() == 1)
{
cbg = acbg;
}
else
{
cbg = ucbg;
}
document.write("&lt;TD ALIGN=CENTER WIDTH=" + wd + " HEIGHT=" + ht + cbg + "&gt;"
+ "&lt;FONT SIZE=" + fs + "&gt;" + ctr + "&lt;/FONT&gt;"
+ "&lt;/TD&gt;";
}
}
document.write("&lt;/TR&gt;&lt;TR&gt;";
rows++;
}
if (rows &lt;= 7)
{
for (var i = 0;i &lt; 7; i++)
{
document.write("&lt;TD ALIGN=CENTER WIDTH=" + wd + " HEIGHT=" + ht + "&gt;"
+ "&nbsp;&lt;/TD&gt;";
}
}
document.write("&lt;/TR&gt;&lt;/TABLE&gt;";
}


apartmentArray = new Array("h001","o002","h005","s010","s012","m004","r007","r004","r008","s011","m001","o004","o001","h003","s004","m011","m005","m007","e003","w002","w001","r002","r003","Lady112","v001","Rocklands41","s116","m008","Keats610","Queenvic14","Alison212","a002","c005","b003","Greatwest38","j001","Carillon306","Wellington52","b004";
function available()
{
cd = bgn;
cd.setDate(ctr);
if (apartment == "mosman"
return(available_mosman());
if (apartment == "o002"
return(available_o002());
return(0);
}

function available_mosman()
{

sd = new Date(2006,0,00);
ed = new Date(2006,3,31);
if (cd &gt;= sd & cd &lt; ed)
return(1);
if (cd &gt;= sd & cd &lt;= ed & calendar == 0)
return(1);

sd = new Date(2006,5,21);
ed = new Date(2006,6,06);
if (cd &gt;= sd & cd &lt; ed)
return(1);
if (cd &gt;= sd & cd &lt;= ed & calendar == 0)
return(1);


sd = new Date(2006,6,07);
ed = new Date(2006,6,10);
if (cd &gt;= sd & cd &lt; ed)
return(1);
if (cd &gt;= sd & cd &lt;= ed & calendar == 0)
return(1);
return(0);
}




&lt;/script&gt;
&lt;!--availCal_end--&gt;
&lt;script language=JavaScript1.2 type=text/javascript&gt;

setAvailability();
document.write("&lt;table&gt;&lt;tr&gt;&lt;td " + acbg + "&gt;&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&lt;/td&gt;&lt;td&gt; - available &lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;";
document.write("&lt;table&gt;&lt;tr&gt;&lt;td " + ucbg + "&gt;&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&lt;/td&gt;&lt;td&gt; - not available&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;";
&lt;/script&gt;
&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;/b&gt;
&lt;/body&gt;
&lt;/html&gt;


Replies


Douglas West
Replied 09 Jan 2006 09:09:48
09 Jan 2006 09:09:48 Douglas West replied:
I just finished an assignment similar; as it was creating a dynamically generated table with Javascript. Looking at your code I think the whole table has to be javascript. But I'm just new to this so hope this helps. Note that I've had to add backslashes to the end tags of the table. This tip from W3C, which validated this code. Plug it in and test it yourself. Leave a note if this helps...
~Smudge

&lt;script language="javascript" type="text/javascript"&gt;
&lt;!--script
document.write('&lt;table width="618" border="1"&gt;');
document.write('&lt;tr&gt;');
document.write('&lt;th scope="col"&gt;Numbers&lt;\/th&gt;');
document.write('&lt;th scope="col"&gt;Squares&lt;\/th&gt;');
document.write('&lt;th scope="col"&gt;Cubes&lt;\/th&gt;');
document.write('&lt;\/tr&gt;');

for (var r = 0; r &lt; 11; r++) {
document.write('&lt;TR&gt;');
for (var c = 0; c &lt; 3; c++) {
document.write('&lt;TD&gt;');
switch(r,c)
{
case 0,0:
document.write(r);
document.write('&lt;\/TD&gt;');
break;
case 0,1:
document.write(r*r);
document.write('&lt;\/TD&gt;');
break;
case 0,2:
document.write((r*r)*r);
document.write('&lt;\/TD&gt;');
break;
}
}
document.write('&lt;\/TR&gt;');
}


document.write('&lt;\/table&gt;');
// --&gt;
&lt;/script&gt;
&lt;/center&gt;
&lt;p&gt;
&lt;a href="validator.w3.org/check?uri=referer"&gt;&lt;img
src="www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Transitional" height="31" width="88" /&gt;&lt;/a&gt;
&lt;/p&gt;

&lt;/body&gt;
&lt;/html&gt;


Edited by - siwidi on 09 Jan 2006 09:13:40

Reply to this topic

Currency:
Company Info
Payment & Pricing
Legal Notices
Guides
Copyright © 2001-2024 Dynamic Zones International B.V., All Rights Reserved.