// JavaScript Document /* Following steps be followed for using this ymcal.js file for getting a date in date range 01/01/1900 to 31/12/2100 in a text box from a displayed calendar. The user can navigate to any month and year by directly selecting the month and year from the given two drop down lists. The user can also increament or decreament any month or year by clicking on < or > links given on both sides of month and year drop down lists. If yellow color is diplayed as a background for a date then it means then that date is the current date as per system date on the client machine. The calendar will be generated in your own page (and not a pop up) which could be an ASP or HTML page. As soon as the host page is closed the calendar also gets closed. The user can define the position of calendar on his page by giving suitable attribute values for x and y. 1. In your host page where you want to display the calendar, Insert the following two lines of code between tags. 2. ymcal.js and ymcalstyle.css both these files should be placed in the same folder where your host page is located. 3. ymcalstyle.css is used for formatting the calendar for its font,color,border,background etc. 4. In your host page where you want to display the calendar, create a

tag. It does not matter where this tag is made. But prefer to make it after the end of all HTML tags or after all the div tags, if used any in your host page. 5. Call function showcalendar(cal,t1,x,y) on any link of say image of calendar or text. Where cal is id for div tag (the place where the calendar will be generated). t1 is the id of the text box where you want the date to be inserted from the calendar. IMPORTANT -- if t1 is encapsulated within a form OR a form is used then just instead of using t1 use form1.t1 -- where form1 is the name of the form of the host page. 6. x is value of the attribute for horizontal position from the left edge of the host page. y is value of the attribute for vertical position from the top edge of the host page. * ********************************************************************************************************** */ var numdays_month = 0 ; var dayno ; var odt ; var odt1 ; var dayno1 ; var dt ; var mo ; var yr ; var max_rows ; var row ; var col ; var cdt ; var cmo ; var cd ; var cyr ; var selmonth ; var selyear ; var minyear =1900 ; var maxyear = 2100 ; var obj1 ; var obj2 ; function generateCalendar(d,g) { cdt = new Date() ; // Current Date Object //cd = cdt.getDate() ; // Current Date cmo = cdt.getMonth() ; // Current Month cyr = cdt.getFullYear() ; // Current Year if (d == '') odt = new Date() ; else odt = new Date(d) ; dayno = odt.getDay() ; if(g != '' && d == '') { cd = cdt.getDate(); // Modification on 02/11/2006 } else if(g == '' && d !='') { cd = ''; //odt.getDate() // Modification on 02/11/2006 } else if(g != '' && d != '') { cd = odt.getDate() ; // Modification on 02/11/2006 } mo = odt.getMonth() ; cmo = odt.getMonth() ; // Modification on 02/11/2006 selmonth = mo ; yr = odt.getFullYear() ; cyr = odt.getFullYear() ; // Modification on 02/11/2006 selyear = yr ; //alert("Month: "+(mo+1)+"\nYear: "+yr); odt1 = new Date(mo+1+"/"+01+"/"+yr) dayno1 = odt1.getDay(); numdays_month = getMaxDaysinMonth(mo,yr) ; var floorval = Math.floor ((numdays_month + dayno1)/(7)) ; var val1 = (numdays_month + dayno1) / 7 ; if ((val1) - (floorval) == 0) max_rows = floorval ; else max_rows = floorval + 1 ; var str ; var str1="" ; var i =1 ; var y ; str = "" str =str + "" str =str + "" str = str +"" str = str +"" str = str +"" str = str +"" str = str +"" str = str +"" str = str +"" str = str +"" for (row=1;row <= max_rows;row++) { str1 = str1+"" ; for(col =1;col <=7;col++) { if ((row == 1 && col <= dayno1) ||( i > numdays_month)) { str1=str1+'' ; } else { if( (i == cd) && (cmo == mo) && (cyr == yr) ) { str1=str1+'' ; } else { str1=str1+'' ; } i=i+1 ; } } str1 = str1+"" } str = str + str1+"

" str = str +"" str = str +"" str = str +"" str = str +"

Sun

Mon

Tue

Wed

Thu

Fri

Sat

'+i+'

'+i+'

" obj2.innerHTML = str ; obj2.style.display = '' ; if (d=='') { document.getElementById("cmonth").selectedIndex = cmo ; } else { document.getElementById("cmonth").selectedIndex = mo ; } } function getMaxDaysinMonth(mo,yr) { switch(mo) { case 0: numdays_month = 31 ; break; case 1: { if((yr % 4)== 0) { numdays_month = 29 ; } else { numdays_month = 28 ; } } break; case 2: numdays_month = 31 ; break; case 3: numdays_month = 30 ; break; case 4: numdays_month = 31 ; break; case 5: numdays_month = 30 ; break; case 6: numdays_month = 31 ; break; case 7: numdays_month = 31 ; break; case 8: numdays_month = 30 ; break; case 9: numdays_month = 31 ; break; case 10: numdays_month = 30 ; break; case 11: numdays_month = 31 ; break; } return numdays_month ; } function getMonthName(mo) { if(mo==0)return "January" ; else if(mo==1)return "February" ; else if(mo==2)return "March" ; else if(mo==3)return "April" ; else if(mo==4)return "May" ; else if(mo==5)return "June" ; else if(mo==6)return "July" ; else if(mo==7)return "August" ; else if(mo==8)return "September" ; else if(mo==9)return "October" ; else if(mo==10)return "November" ; else if(mo==11)return "December" ; } function getDayName(dayno) { if(dayno==0)return "Sunday" ; else if(dayno==1)return "Monday" ; else if(dayno==2)return "Tuesday" ; else if(dayno==3)return "Wednesday" ; else if(dayno==4)return "Thursday" ; else if(dayno==5)return "Friday" ; else if(dayno==6)return "Saturday" ; } function changemonth() { var omonth = document.getElementById("cmonth") ; var selmo = parseInt(omonth.value) +1 ; var d = selmo+"/01/"+selyear ; generateCalendar(d,'') ; document.getElementById("cmonth").selectedIndex = selmo-1 ; document.getElementById("year").selectedIndex = (selyear - minyear) } function changeyear() { var newyear = document.getElementById("year").value ; var d = (selmonth+1)+"/01/"+newyear ; generateCalendar(d,'') ; document.getElementById("year").selectedIndex = (newyear - minyear) document.getElementById("cmonth").selectedIndex = selmonth ; } function prevmonth() { if (selmonth == 0 && selyear > minyear) { selmonth = 12 ; selyear = selyear -1 ; var d = selmonth+"/01/"+(selyear) } if(selmonth > 0 ) { var d = selmonth+"/01/"+(selyear) generateCalendar(d,'') ; } document.getElementById("year").selectedIndex = (selyear - minyear) document.getElementById("cmonth").selectedIndex = selmonth ; } function nextmonth() { if (selmonth == 11 && selyear == maxyear) return; if (selmonth == 11 && selyear < maxyear) { selmonth = 1 ; selyear = selyear + 1 ; var d = selmonth+"/01/"+selyear ; generateCalendar(d,'') ; document.getElementById("year").selectedIndex = (selyear - minyear) document.getElementById("cmonth").selectedIndex = selmonth ; return ; } if(selmonth < 11 ) { selmonth = selmonth+2 ; var d = selmonth+"/01/"+selyear ; } generateCalendar(d,'') ; document.getElementById("year").selectedIndex = (selyear - minyear) document.getElementById("cmonth").selectedIndex = selmonth ; } function prevyear() { if (selyear > minyear) (selyear = selyear - 1 ); var d = (selmonth+1)+"/01/"+ selyear generateCalendar(d,'') ; document.getElementById("year").selectedIndex = (selyear - minyear) document.getElementById("cmonth").selectedIndex = selmonth ; } function nextyear() { if (selyear < maxyear) (selyear = selyear + 1 ); var d = (selmonth+1)+"/01/"+ selyear generateCalendar(d,'') ; document.getElementById("year").selectedIndex = (selyear - minyear) document.getElementById("cmonth").selectedIndex = selmonth ; } function findpos(obj) { var curleft = curtop = 0; if (obj.offsetParent) { curleft = obj.offsetLeft curtop = obj.offsetTop //alert(curleft + ' ' + curtop); while (obj = obj.offsetParent) { curleft += obj.offsetLeft curtop += obj.offsetTop } } return [curleft,curtop]; } function showCalendar(objCal,objDate,coordLeft,coordTop) { var cntrlCoords, crdLeft, crdTop; cntrlCoords = findpos(objDate); crdLeft = cntrlCoords[0] + objDate.offsetWidth + 15; crdTop = cntrlCoords[1]; showcalendar(objCal, objDate, crdLeft, crdTop); } function showcalendar(cal,t1,x,y) { obj1 = t1 ; var senddate = '' var recdate = t1.value ; var datearr ; var checkvaliddate = true ; if(recdate != '') { checkvaliddate = validate_receiveddate(recdate) ; //alert("Check Valid Date : "+ checkvaliddate ); if( checkvaliddate == true) { datearr = recdate.split("/") ; senddate = datearr[1] + '/' + datearr[0] + '/' + datearr[2] ; } else { return false ; } } obj2 = cal ; obj2.style.display = "none" ; obj2.style.position="absolute" ; generateCalendar(senddate,'g'); obj2.style.left= x ; obj2.style.top= y ; obj2.style.display = "" ; } function transfervalue(a) { obj1.value = a+"/" + (mo+1) + "/"+yr ; obj2.style.display = "none" ; } function closecalendar() { obj1.value = "" ; obj2.style.display = "none" ; } function validate_receiveddate(recdate) { var datearr = recdate.split("/"); if(recdate.indexOf('.') >= 0) { return false ; } if(datearr.length < 3) { return false ; } else if(datearr.length == 3 && datearr[2]=='') { return false ; } else if(datearr.length == 3 && (isNaN(datearr[0])== true || isNaN(datearr[1])== true ||isNaN(datearr[2])== true )) { return false ; } else if(datearr.length == 3) { if(isNaN(datearr[0])== false ) { var checknum =''; checknum = datearr[0]; if(checknum == '08') { checknum = '8' } else if(checknum == '09') { checknum = '9' } if(parseInt(checknum) <= 0 || parseInt(checknum)> 31 ) { return false ; } } if(isNaN(datearr[1])== false ) { var checknum =''; checknum = datearr[1]; if(checknum == '08') { checknum = '8' } else if(checknum == '09') { checknum = '9' } if(parseInt(checknum) <= 0 || parseInt(checknum) > 12 ) { return false ; } } if(isNaN(datearr[2])== false ) { //alert("datearr[2])== false") ; if(parseInt(datearr[2]) < 1900 || parseInt(datearr[2]) >= 2100 ) { //alert("datearr[2]) <= 1900 || parseInt(datearr[1])> 2100") ; return false ; } } return true ; } else { return true ; } }