Calendar problem.

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • pankajit09
    Contributor
    • Dec 2006
    • 296

    Calendar problem.

    Hello,

    I have developed a calendar program in Javascript which opens a calendar as a popup window and when a user clicks on a date the date is copied into the parent windows textbox.

    The code of the parent window is as follows -->

    Code:
    <html>
    <head>
    	<title>calendar</title>
    </head>
    
    <body>
    <input type="text" name="parent"/>
    <a href="javascript:void(0);" onClick=window.open("cal_popup.html");>Click here to open the calendar window</a>
    </body>
    
    </html>

    The code of the popup window is like this -->

    Code:
    <html>
    
    <head>
    <title>Calendar</title>
    <script language="javascript" type="text/javascript">
    
    function post_value(mm,dt,yy){
    opener.document.parent.value = mm + "/" + dt + "/" + yy;
    self.close();
    }
    
    
    function gen_cal(prm,chm) {
    	myDate = new Date();
    
    	var m,d,y;
    	if(prm){
    	m=prm+chm;
    	}
    	else{
    	m= myDate.getMonth();
    	}
    
    	d= myDate.getDate(); // Finds today's date
    	y= myDate.getFullYear(); // Finds today's year
    
    	var string = new Date(y,m,d);
    	var newstring = string.toString();
    	var string_array = newstring.split(" ");
    
    
    //	mn --> Month is calculated to display at the top of the calendar for eg: Jan
    	var mn = string_array[1];
    
    	//yn--> Year is calculated to display at the top of the calendar for eg: 2007
    	var yn = string_array[5];
    
    	//no_of_days -->This is to calculate number of days in a month
    	var no_of_days;
    	if(mn == "Jan" || mn == "Mar" || mn == "May" || mn == "Jul" || mn == "Aug" || mn == "Oct" || mn == "Dec")
    		no_of_days = 31;
    	if(mn == "Apr" || mn == "Jun" || mn == "Sep" || mn == "Nov")
    		no_of_days = 30;
    	if(mn == "Feb")
    		if(yn % 4 == 0)
    	    no_of_days = 29;
    	    else
    	    no_of_days = 28;
    
    	//j--> This will have the week day of the first day of the month
    	myArray = new Array("Sun", "Mon", "Tue", "Wed", "Thu","Fri", "Sat");
    	myDate1 = new Date(y,m,1);
    	var newdate1 = myDate1.toString();
    	var string_date = newdate1.split(" ");
    	var j = string_date[0];
    
    	for(i=0;i<myArray.length;i++) {
    		if(myArray[i] == j)
    		j=i;
    	}
    
    	var adj = "<td>&nbsp;</td>";
    	for(k=2; k<=j; k++){ // Adjustment of date starting
    		adj = adj + "<td>&nbsp;</td>";
    	}
    
    	// Starting of top line showing name of the days of the week
    
    	document.write(" <table border='1' bordercolor='#FFFF00' cellspacing='0' cellpadding='0' align=center><tr><td>");
    
    	document.write("<table cellspacing='0' cellpadding='0' align=center width='100' border='1'><td align=center bgcolor='#ffff00'><font size='3' face='Tahoma'> <a href='javascript:gen_cal("+m+",-1);'><</a> </td><td colspan=5 align=center bgcolor='#ffff00'><font size='3' face='Tahoma'>" + mn + yn + "</td><td align=center bgcolor='#ffff00'><font size='3' face='Tahoma'> <a href='javascript:gen_cal("+m+",1);'>></a> </td></tr><tr>");
    
    	document.write("<td><font size='3' face='Tahoma'><b>Sun</b></font></td><td><font size='3' face='Tahoma'><b>Mon</b></font></td><td><font size='3' face='Tahoma'><b>Tue</b></font></td><td><font size='3' face='Tahoma'><b>Wed</b></font></td><td><font size='3' face='Tahoma'><b>Thu</b></font></td><td><font size='3' face='Tahoma'><b>Fri</b></font></td><td><font size='3' face='Tahoma'><b>Sat</b></font></td></tr><tr>");
    
    	////// End of the top line showing name of the days of the week//////////
    
    	//////// Starting of the days//////////
    	var pv;
    	for(i=1;i<=no_of_days;i++){
    		pv = m + "," + i + "," + yn;
    		document.write(adj + "<td valign=top><font size='2' face='Tahoma'><a href='#'onClick='post_value("+pv+");'>" + i + "</a><br>");
    		// This will display the date inside the calendar cell
    		document.write(" </font></td>");
    		adj='';
    		j++;
    		if(j==7){
    			document.write("</tr><tr>");
    			j=0;
    		}
    	}
    	document.write("</tr></table></td></tr></table>");
    }
    
    
    </script>
    </head>
    
    <body onLoad="javascript:gen_cal();">
    </body>
    </html>
    Please copy them in two files and run in IE .


    There are 2 PROBLEMS -->
    1.The month navigation is not working .
    2. When we click on a date it should get copied inside a textbox which is not happening.

    Please help me in solving this as its very urgent.
  • pbmods
    Recognized Expert Expert
    • Apr 2007
    • 5821

    #2
    Originally posted by pankajit09
    Please copy them in two files and run in IE .
    If you wanted us to do that, why didn't you just upload your two text files as attachments?

    Comment

    • pankajit09
      Contributor
      • Dec 2006
      • 296

      #3
      Originally posted by pbmods
      If you wanted us to do that, why didn't you just upload your two text files as attachments?
      How to upload files as attachment ?

      Comment

      • acoder
        Recognized Expert MVP
        • Nov 2006
        • 16032

        #4
        Put your text box inside form tags so you can reference it properly. Also, avoid using names like "parent". You could give it an id instead and use:
        Code:
        document.getElementById(yourid).value=...

        Comment

        • pankajit09
          Contributor
          • Dec 2006
          • 296

          #5
          I am facing problem in the below section. Its the NAVIGATION part -->


          Code:
          	document.write("<table cellspacing='0' cellpadding='0' align=center width='100' border='1'><td align=center bgcolor='#ffff00'><font size='3'> <a href='javascript:gen_cal("+m+",-1);'><</a> </td><td colspan=5 align=center bgcolor='#4444ff'><font size='3' color='white'><b>" + mn + yn + "</b></td><td align=center bgcolor='#ffff00'><font size='3'> <a href='javascript:gen_cal("+m+",1);'>></a> </td></tr><tr>");


          Please help.

          Comment

          • pankajit09
            Contributor
            • Dec 2006
            • 296

            #6
            ok I have uploaded the two files.


            cal_popup.html
            http://www.megaupload. com/?d=X4ROLHVI


            calendar.html
            http://www.megaupload. com/?d=P7OP46BY


            Please run them in IE and solve the problem.

            Only "Navigation " is the problem.

            Comment

            • acoder
              Recognized Expert MVP
              • Nov 2006
              • 16032

              #7
              What error do you get? Is this problem only in IE or have you not tested on other browsers?

              Comment

              • pankajit09
                Contributor
                • Dec 2006
                • 296

                #8
                Originally posted by acoder
                What error do you get? Is this problem only in IE or have you not tested on other browsers?

                First please run those files then you will come to know the problem.

                Its just a syntax problem of document.write .

                Comment

                Working...