I am working on a mobile site (my first) and I have a popup calendar on one of the pages, which is used to select and auto fill the date filed. This option works fine on my PC, iphone and android, but not on the PDAs running windows mobile 5, which will be the main platform for my site.

Here is the code for the calendar, please look it over and either give me some hints, or a good reference which deals directly with my issue. thank you.

Code:


    <script language="javascript" type="text/javascript">
    /* <[CDATA[ */
           var dateObject = new Date();
           var month = dateObject.getMonth();
           var monthArray = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
           function getTodayDate()
           {
           	var dateToday = monthArray[month] + " "
           		+ dateObject.getDate() + ", "
           		+ dateObject.getFullYear();
           	document.formInfo.date.value = dateToday;
           }
           
           function displayCalendar(whichMonth)
           {
           	calendarWin = window.open("", "CalWindow", "status=no, resizable=yes, width=230, height=200, left=50, top=100");
           	calendarWin.focus();
           	calendarWin.document.write("<!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>Calendar</title> <link href='style.css' rel='stylesheet' type='text/css' /></head><body>");
		calendarWin.document.write("<table cellspacing='0' border='1' width='100%'>");
		calendarWin.document.write("<colgroup span='7' width='50' />");
		
		//calendarWin.document.write("<tr><td colspan='7' align='center'><strong>" + monthArray[month] + " " + dateObject.getFullYear() + "</strong>></td></tr>");
		
		if (whichMonth == -1)
		{
			dateObject.setMonth(dateObject.getMonth()-1);
		}
		else if (whichMonth == 1)
		{
			dateObject.setMonth(dateObject.getMonth()+1);
		}		
		var month = dateObject.getMonth();
		calendarWin.document.write("<tr><td colspan='2'><a href='' onclick='self.opener.displayCalendar(-1); return false'>Previous</a></td> "
			+ "<td colspan='3' align='center'><strong>" + monthArray[month] + " " + dateObject.getFullYear() + "</strong></td> "
			+ "<td colspan='2' align='right'><a href='' onclick='self.opener.displayCalendar(1); return false'>Next</a></td></tr>");
				
		
		calendarWin.document.write("<tr align='center'><td>Sun</td><td>Mon</td><td>Tue</td><td>Wed</td><td>Thu</td><td>Fri</td><td>Sat</td></tr>");
		calendarWin.document.write("<tr align='center'>");
		
		dateObject.setDate(1);
		var dayOfWeek = dateObject.getDay();
		for (var i=0; i<dayOfWeek; i++)
		{
			calendarWin.document.write("<td>&nbsp;</td>");
		}
		
		var daysWithDates = 7 - dayOfWeek;
		var dateCounter = 1;
		for(var i=0; i<daysWithDates; i++)
		{
			var curDate = monthArray[month] + " "
				+ dateCounter + ", "
				+ dateObject.getFullYear();
			calendarWin.document.write("<td><a href='' onclick='self.opener.document.formInfo.date.value=\"" + curDate + "\";self.close()'>" + dateCounter + "<a/></td>");
			++dateCounter;
		}
		
		var numDays = 0;
		//January, March, may, July, August, October, December
		if (month == 0 || month == 2 || month == 4 || month == 6 || month == 6 || month == 7 || month == 9|| month == 11)
		{
			numDays = 31;
		}
		// February
		else if (month == 1)
		{
			numDays = 28;
		}
		// April, June, Septembr, November
		else if (month == 3 || month == 5 || month == 8 || month == 10)
		{
			numDays = 30;
		}
		
		for (var rowCounter = 0; rowCounter < 5; rowCounter++)
		{
			var weekDayCounter = 0;
			calendarWin.document.write("<tr align='center'>");
			
			while (weekDayCounter < 7)
			{
				var curDate = monthArray[month] + " "
					+ dateCounter + ", "
					+ dateObject.getFullYear();
				if (dateCounter <= numDays)
				{
					calendarWin.document.write("<td><a href='' onclick='self.opener.document.formInfo.date.value=\"" + curDate + "\";self.close()'>" + dateCounter + "</a></td>");
				}
				else
				{
					calendarWin.document.write("<td>&nbsp;</td>");
				}				
				++weekDayCounter;
				++dateCounter;
				
			}
			calendarWin.document.write("</tr>");
		}
		calendarWin.document.write("</table></body></html>");
		calendarWin.document.close();
		
	}
/* <]] */
</script>