JavaScript

Welcome to Dream.In.Code
	Getting Help is Easy! Join 131,739 Programmers for FREE! Get instant access to thousands of experts, tutorials, code snippets, and more! There are 2,181 people online right now. Registration is fast and FREE... Join Now! Chat LIVE With a Expert

Java Scrip't Calender Script to display coming Years months

Java Scrip't Calender Script to display coming Years months

Options

Auctioneer	10 Oct, 2008 - 12:18 PM Post #1
New D.I.C Head Joined: 17 Nov, 2007 Posts: 3 My Contributions	Hello I use this Calender in one of my Scripts, and I display 3 Months on the Webpage. Unfortunately, near Years End, the Calender cannot display next Years Calender. Is someone capable to show me how to display months, if they fall into the next Year. Many thanks Ernie DynamicsDrive Link Script within the HTML Page: CODE <script type="text/javascript"> var todaydate=new Date() var curmonth=todaydate.getMonth()+1 //get current month (1-12) var curyear=todaydate.getFullYear() //get current year </script> <div align=center><center><table width=660 border="0" cellspacing="0" cellpadding="6"> <tr><td align=center width="33%"> <script> document.write(buildCal(curmonth ,curyear, "main", "month", "daysofweek", "days", 1)); </script> </td><td align=center width="33%"> <script> document.write(buildCal(curmonth+1 ,curyear, "main", "month", "daysofweek", "days", 1)); </script> </td><td align=center width="33%"> <script> document.write(buildCal(curmonth+2 ,curyear, "main", "month", "daysofweek", "days", 1)); </script> Content basiccalender.js: CODE function buildCal(m, y, cM, cH, cDW, cD, brdr){ var mn=['January','February','March','April','May','June','July','August','September','October','November','December']; var dim=[31,0,31,30,31,30,31,31,30,31,30,31]; var oD = new Date(y, m-1, 1); //DD replaced line to fix date bug when current day is 31st oD.od=oD.getDay()+1; //DD replaced line to fix date bug when current day is 31st var todaydate=new Date() //DD added var scanfortoday=(y==todaydate.getFullYear() && m==todaydate.getMonth()+1)? todaydate.getDate() : 0 //DD added dim[1]=(((oD.getFullYear()%100!=0)&&(oD.getFullYear()%4==0))\|\|(oD.getFullYear()%400==0))?29:28; var t='<div class="'+cM+'"><table class="'+cM+'" cols="7" cellpadding="3" border="1" cellspacing="0" style="border-collapse:collapse" bordercolor="#848444"><tr align="center">'; t+='<td colspan="7" align="center" class="'+cH+'">'+mn[m-1]+' - '+y+'</td></tr><tr align="center">'; for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+"SMTWTFS".substr(s,1)+'</td>'; t+='</tr><tr align="center">'; for(i=1;i<=42;i++){ var x=((i-oD.od>=0)&&(i-oD.od<dim[m-1]))? i-oD.od+1 : ' '; if (x==scanfortoday) //DD added x='<span id="today">'+x+'</span>' //DD added t+='<td class="'+cD+'">'+x+'</td>'; if(((i)%7==0)&&(i<36))t+='</tr><tr align="center">'; } return t+='</tr></table></div>'; }
	This Post Was Helpful! ^New!


Register for Free to Make These Ads Go Away!

OliveOyl3471	13 Oct, 2008 - 03:23 AM Post #2
It's all about the code ♥ Joined: 11 Jul, 2007 Posts: 1,460 Thanked 14 times Dream Kudos: 100 My Contributions	Hi. If I understand it correctly, you are getting your month values from your array, are you not? This will work, but I'm pretty sure this exact code will only work if the current month happens to be October. Anyway it does display correctly, at least for me. I know there is a better way. You probably should start reading the array from the beginning again after December is displayed. That way you could go on forever without having to hard code it so much. It seems to me that it would be more useful and versatile that way. Here's what I did to get it to display January. Add this code to your .js document. jscript </td><td align=center width="33%"> <script> document.write(buildCal(curmonth-9 ,curyear+1, "main", "month", "daysofweek", "days", 1)); </script>
	This Post Was Helpful! ^New!

OliveOyl3471

13 Oct, 2008 - 04:04 AM

Post #3

It's all about the code ♥

Joined: 11 Jul, 2007
Posts: 1,460

Who Cares

Thanked 14 times

Dream Kudos: 100
My Contributions

Here's a better version, although I think the best way would be to put this repeating code in a loop.
I haven't gotten that to work yet, but this will work:

jscript


<body>
<script type="text/javascript">

    var todaydate=new Date()
    var curmonth=todaydate.getMonth()+1 //get current month (1-12)
    var curyear=todaydate.getFullYear() //get current year

</script>
    <div align=center><center><table width=660 border="0" cellspacing="0" cellpadding="6">
    <tr><td align=center width="33%">
    <script>
    document.write(buildCal(curmonth ,curyear, "main", "month", "daysofweek", "days", 1));
    </script>
    </td><td align=center width="33%">
    <script>
		curmonth++;
		if(curmonth==13)
		{
		curmonth=1;
		curyear=curyear+1;
		}
    document.write(buildCal(curmonth ,curyear, "main", "month", "daysofweek", "days", 1));
    </script>
    </td><td align=center width="33%">
    <script>
		curmonth++;
		if(curmonth==13)
		{
		curmonth=1;
		curyear=curyear+1;
		}
    document.write(buildCal(curmonth ,curyear, "main", "month", "daysofweek", "days", 1));
    </script>
	    </td><td align=center width="33%">
    <script>
		curmonth++;
		if(curmonth==13)
		{
		curmonth=1;
		curyear=curyear+1;
		}
    document.write(buildCal(curmonth ,curyear, "main", "month", "daysofweek", "days", 1));
    </script>
</body>

edit--forgot to check and update year if necessary

This post has been edited by OliveOyl3471: 13 Oct, 2008 - 04:09 AM

This Post Was Helpful! ^New!

Auctioneer	13 Oct, 2008 - 04:41 AM Post #4
New D.I.C Head Joined: 17 Nov, 2007 Posts: 3 My Contributions	Thank you very much! The code now works perfect. I think that some other Users of this Calendar Script will be using your solution too. Great stuff! Ernie
	This Post Was Helpful! ^New!

OliveOyl3471	13 Oct, 2008 - 05:33 AM Post #5
It's all about the code ♥ Joined: 11 Jul, 2007 Posts: 1,460 Thanked 14 times Dream Kudos: 100 My Contributions	You're quite welcome! I'm glad I could help. It still bothers me that I couldn't get the loop to work properly, though. It would be better with a loop instead of having to repeat code.
	This Post Was Helpful! ^New!