Connecting Tech Pros Worldwide Help | Site Map
bytes > topic > php > answers

changing color of calendar dates

Member
  
Join Date: Jan 2008
Posts: 59
#1: Feb 28 '08
Hi all,

Please anybody help me solve this problem. I am stuck up with this from past 2 weeks. I am developing an application where, when the user selects date from javascript datepicker and enters the comments and clicks the save button then the date and the date will be stored in the mysql database. This is working fine. But my problem is when, after the user had made an entry the date in the calendar for which an entry has made should be changed to green colour. Have anyone has faced similar kind of problem and have got the solution please help me. Here is the code I am using

cal.php

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. function Show(){     
  3.  
  4.  
  5.     var date_id = document.getElementById("date_id").value;
  6.  
  7.  
  8.  
  9. CreateRequest();
  10.  
  11. var URL='display.php';
  12.  
  13. request.open("POST",URL,true);
  14.  
  15. request.onreadystatechange=handleHttpResponse;
  16.  
  17. request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  18.  
  19. request.send("id="+escape(date_id));
  20. }
  21. <body>
  22. <script type="text/javascript" src="date-picker.js"></script>
  23. <form name="Calender1">
  24. <br>
  25. <br>
  26.  
  27. <a STYLE="text-decoration: none" onmouseover="window.status='Date Picker';return true;" onmouseout="window.status='';return true;" href="javascript:show_calendar('Calender1.date_id')" >
  28.  
  29. <IMG title="calendar" align="right" height=21 src="iconCalendar.gif" width=30 border=0></a>
  30. <input type="hidden" class="textBox" type="text" readonly name="date_id" id="date_id" size="10">
  31. </form>
  32. <input type="submit" value="Get it" onclick="Show()">    
  33. </body>
  34. </html>

date-picker.js

Expand|Select|Wrap|Line Numbers
  1. var weekend = [0,6];
  2.  
  3. var weekendColor = "#e0e0e0";
  4.  
  5. var fontface = "Verdana";
  6.  
  7. var fontsize = 2;
  8.  
  9.  
  10.  
  11. var gNow = new Date();
  12.  
  13. var ggWinCal;
  14.  
  15. isNav = (navigator.appName.indexOf("Netscape") != -1) ? true : false;
  16.  
  17. isIE = (navigator.appName.indexOf("Microsoft") != -1) ? true : false;
  18.  
  19.  
  20.  
  21. Calendar.Months = ["January", "February", "March", "April", "May", "June",
  22.  
  23. "July", "August", "September", "October", "November", "December"];
  24.  
  25.  
  26.  
  27. // Non-Leap year Month days..
  28.  
  29. Calendar.DOMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
  30.  
  31. // Leap year Month days..
  32.  
  33. Calendar.lDOMonth = [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
  34.  
  35.  
  36.  
  37. function Calendar(p_item, p_WinCal, p_month, p_year, p_format) {
  38.  
  39.     if ((p_month == null) && (p_year == null))    return;
  40.  
  41.  
  42.  
  43.     if (p_WinCal == null)
  44.  
  45.         this.gWinCal = ggWinCal;
  46.  
  47.     else
  48.  
  49.         this.gWinCal = p_WinCal;
  50.  
  51.  
  52.  
  53.     if (p_month == null) {
  54.  
  55.         this.gMonthName = null;
  56.  
  57.         this.gMonth = null;
  58.  
  59.         this.gYearly = true;
  60.  
  61.     } else {
  62.  
  63.         this.gMonthName = Calendar.get_month(p_month);
  64.  
  65.         this.gMonth = new Number(p_month);
  66.  
  67.         this.gYearly = false;
  68.  
  69.     }
  70.  
  71.  
  72.  
  73.     this.gYear = p_year;
  74.  
  75.     this.gFormat = p_format;
  76.  
  77.     this.gBGColor = "white";
  78.  
  79.     this.gFGColor = "black";
  80.  
  81.     this.gTextColor = "black";
  82.  
  83.     this.gHeaderColor = "black";
  84.  
  85.     this.gReturnItem = p_item;
  86.  
  87. }
  88.  
  89.  
Code continues...
Expand|Select|Wrap|Line Numbers
  1.  
  2. Calendar.get_month = Calendar_get_month;
  3.  
  4. Calendar.get_daysofmonth = Calendar_get_daysofmonth;
  5.  
  6. Calendar.calc_month_year = Calendar_calc_month_year;
  7.  
  8. Calendar.print = Calendar_print;
  9.  
  10.  
  11.  
  12. function Calendar_get_month(monthNo) {
  13.  
  14.     return Calendar.Months[monthNo];
  15.  
  16. }
  17.  
  18.  
  19.  
  20. function Calendar_get_daysofmonth(monthNo, p_year) {
  21.  
  22.     /* 
  23.  
  24.     Check for leap year ..
  25.  
  26.     1.Years evenly divisible by four are normally leap years, except for... 
  27.  
  28.     2.Years also evenly divisible by 100 are not leap years, except for... 
  29.  
  30.     3.Years also evenly divisible by 400 are leap years. 
  31.  
  32.     */
  33.  
  34.     if ((p_year % 4) == 0) {
  35.  
  36.         if ((p_year % 100) == 0 && (p_year % 400) != 0)
  37.  
  38.             return Calendar.DOMonth[monthNo];
  39.  
  40.  
  41.  
  42.         return Calendar.lDOMonth[monthNo];
  43.  
  44.     } else
  45.  
  46.         return Calendar.DOMonth[monthNo];
  47.  
  48. }
  49.  
  50.  
  51.  
  52. function Calendar_calc_month_year(p_Month, p_Year, incr) {
  53.  
  54.     /* 
  55.  
  56.     Will return an 1-D array with 1st element being the calculated month 
  57.  
  58.     and second being the calculated year 
  59.  
  60.     after applying the month increment/decrement as specified by 'incr' parameter.
  61.  
  62.     'incr' will normally have 1/-1 to navigate thru the months.
  63.  
  64.     */
  65.  
  66.     var ret_arr = new Array();
  67.  
  68.  
  69.  
  70.     if (incr == -1) {
  71.  
  72.         // B A C K W A R D
  73.  
  74.         if (p_Month == 0) {
  75.  
  76.             ret_arr[0] = 11;
  77.  
  78.             ret_arr[1] = parseInt(p_Year) - 1;
  79.  
  80.         }
  81.  
  82.         else {
  83.  
  84.             ret_arr[0] = parseInt(p_Month) - 1;
  85.  
  86.             ret_arr[1] = parseInt(p_Year);
  87.  
  88.         }
  89.  
  90.     } else if (incr == 1) {
  91.  
  92.         // F O R W A R D
  93.  
  94.         if (p_Month == 11) {
  95.  
  96.             ret_arr[0] = 0;
  97.  
  98.             ret_arr[1] = parseInt(p_Year) + 1;
  99.  
  100.         }
  101.  
  102.         else {
  103.  
  104.             ret_arr[0] = parseInt(p_Month) + 1;
  105.  
  106.             ret_arr[1] = parseInt(p_Year);
  107.  
  108.         }
  109.  
  110.     }
  111.  
  112.  
  113.  
  114.     return ret_arr;
  115.  
  116. }
  117.  
  118.  
More code here...
Expand|Select|Wrap|Line Numbers
  1.  
  2. function Calendar_print() {
  3.  
  4.     ggWinCal.print();
  5.  
  6. }
  7.  
  8.  
  9.  
  10. function Calendar_calc_month_year(p_Month, p_Year, incr) {
  11.  
  12.     /* 
  13.  
  14.     Will return an 1-D array with 1st element being the calculated month 
  15.  
  16.     and second being the calculated year 
  17.  
  18.     after applying the month increment/decrement as specified by 'incr' parameter.
  19.  
  20.     'incr' will normally have 1/-1 to navigate thru the months.
  21.  
  22.     */
  23.  
  24.     var ret_arr = new Array();
  25.  
  26.  
  27.  
  28.     if (incr == -1) {
  29.  
  30.         // B A C K W A R D
  31.  
  32.         if (p_Month == 0) {
  33.  
  34.             ret_arr[0] = 11;
  35.  
  36.             ret_arr[1] = parseInt(p_Year) - 1;
  37.  
  38.         }
  39.  
  40.         else {
  41.  
  42.             ret_arr[0] = parseInt(p_Month) - 1;
  43.  
  44.             ret_arr[1] = parseInt(p_Year);
  45.  
  46.         }
  47.  
  48.     } else if (incr == 1) {
  49.  
  50.         // F O R W A R D
  51.  
  52.         if (p_Month == 11) {
  53.  
  54.             ret_arr[0] = 0;
  55.  
  56.             ret_arr[1] = parseInt(p_Year) + 1;
  57.  
  58.         }
  59.  
  60.         else {
  61.  
  62.             ret_arr[0] = parseInt(p_Month) + 1;
  63.  
  64.             ret_arr[1] = parseInt(p_Year);
  65.  
  66.         }
  67.  
  68.     }
  69.  
  70.  
  71.  
  72.     return ret_arr;
  73.  
  74. }
  75.  
  76.  
  77.  
  78. // This is for compatibility with Navigator 3, we have to create and discard one object before the prototype object exists.
  79.  
  80. new Calendar();
  81.  
  82.  
  83.  
  84. Calendar.prototype.getMonthlyCalendarCode = function() {
  85.  
  86.     var vCode = "";
  87.  
  88.     var vHeader_Code = "";
  89.  
  90.     var vData_Code = "";
  91.  
  92.  
  93.  
  94.     // Begin Table Drawing code here..
  95.  
  96.     vCode = vCode + "<TABLE BORDER=1 BGCOLOR=\"" + this.gBGColor + "\">";
  97.  
  98.  
  99.  
  100.     vHeader_Code = this.cal_header();
  101.  
  102.     vData_Code = this.cal_data();
  103.  
  104.     vCode = vCode + vHeader_Code + vData_Code;
  105.  
  106.  
  107.  
  108.     vCode = vCode + "</TABLE>";
  109.  
  110.  
  111.  
  112.     return vCode;
  113.  
  114. }
  115.  
  116.  
Continued...
Expand|Select|Wrap|Line Numbers
  1.  
  2. Calendar.prototype.show = function() {
  3.  
  4.     var vCode = "";
  5.  
  6.  
  7.  
  8.     this.gWinCal.document.open();
  9.  
  10.  
  11.  
  12.     // Setup the page...
  13.  
  14.     this.wwrite("<html>");
  15.  
  16.     this.wwrite("<head><title>Calendar</title>");
  17.  
  18.     this.wwrite("</head>");
  19.  
  20.  
  21.  
  22.     this.wwrite("<body " + 
  23.  
  24.         "link=\"" + this.gLinkColor + "\" " + 
  25.  
  26.         "vlink=\"" + this.gLinkColor + "\" " +
  27.  
  28.         "alink=\"" + this.gLinkColor + "\" " +
  29.  
  30.         "text=\"" + this.gTextColor + "\">");
  31.  
  32.     this.wwriteA("<FONT COLOR='RED' FACE='" + fontface + "' SIZE=2><B>");
  33.  
  34.     this.wwriteA(this.gMonthName + " " + this.gYear);
  35.  
  36.     this.wwriteA("</B><BR>");
  37.  
  38.  
  39.  
  40.     // Show navigation buttons
  41.  
  42.     var prevMMYYYY = Calendar.calc_month_year(this.gMonth, this.gYear, -1);
  43.  
  44.     var prevMM = prevMMYYYY[0];
  45.  
  46.     var prevYYYY = prevMMYYYY[1];
  47.  
  48.  
  49.  
  50.     var nextMMYYYY = Calendar.calc_month_year(this.gMonth, this.gYear, 1);
  51.  
  52.     var nextMM = nextMMYYYY[0];
  53.  
  54.     var nextYYYY = nextMMYYYY[1];
  55.  
  56.  
  57.  
  58.     this.wwrite("<TABLE WIDTH='100%' BORDER=1 CELLSPACING=0 CELLPADDING=0 BGCOLOR='#e0e0e0'><TR bgcolor=e0e0e0><TD ALIGN=center>");
  59.  
  60.     this.wwrite("<A HREF=\"" +
  61.  
  62.         "javascript:window.opener.Build(" + 
  63.  
  64.         "'" + this.gReturnItem + "', '" + this.gMonth + "', '" + (parseInt(this.gYear)-1) + "', '" + this.gFormat + "'" +
  65.  
  66.         ");" +
  67.  
  68.         "\"><<<\/A>           </TD><TD ALIGN=center>");
  69.  
  70.     this.wwrite("<A HREF=\"" +
  71.  
  72.         "javascript:window.opener.Build(" + 
  73.  
  74.         "'" + this.gReturnItem + "', '" + prevMM + "', '" + prevYYYY + "', '" + this.gFormat + "'" +
  75.  
  76.         ");" +
  77.  
  78.         "\"><<\/A></TD><TD ALIGN=center>");
  79.  
  80.     this.wwrite("  <A HREF=\"javascript:none();\"></A>             </TD><TD ALIGN=center>");
  81.  
  82.     this.wwrite("  <A HREF=\"" +
  83.  
  84.         "javascript:window.opener.Build(" + 
  85.  
  86.         "'" + this.gReturnItem + "', '" + nextMM + "', '" + nextYYYY + "', '" + this.gFormat + "'" +
  87.  
  88.         ");" +
  89.  
  90.         "\">><\/A>            </TD><TD ALIGN=center>");
  91.  
  92.     this.wwrite("  <A HREF=\"" +
  93.  
  94.         "javascript:window.opener.Build(" + 
  95.  
  96.         "'" + this.gReturnItem + "', '" + this.gMonth + "', '" + (parseInt(this.gYear)+1) + "', '" + this.gFormat + "'" +
  97.  
  98.         ");" +
  99.  
  100.         "\">>><\/A>           </TD></TR></TABLE><BR>");
  101.  
  102.  
  103.  
  104.     // Get the complete calendar code for the month..
  105.  
  106.     vCode = this.getMonthlyCalendarCode();
  107.  
  108.     this.wwrite(vCode);
  109.  
  110.  
  111.  
  112.     this.wwrite("</font></body></html>");
  113.  
  114.     this.gWinCal.document.close();
  115.  
  116. }
  117.  
  118.  
  119.  
  120. Calendar.prototype.showY = function() {
  121.  
  122.     var vCode = "";
  123.  
  124.     var i;
  125.  
  126.     var vr, vc, vx, vy;        // Row, Column, X-coord, Y-coord
  127.  
  128.     var vxf = 285;            // X-Factor
  129.  
  130.     var vyf = 200;            // Y-Factor
  131.  
  132.     var vxm = 10;            // X-margin
  133.  
  134.     var vym;                // Y-margin
  135.  
  136.     if (isIE)    vym = 75;
  137.  
  138.     else if (isNav)    vym = 25;
  139.  
  140.  
  141.  
  142.     this.gWinCal.document.open();
  143.  
  144.  
  145.  
  146.     this.wwrite("<html>");
  147.  
  148.     this.wwrite("<head><title>Calendar</title>");
  149.  
  150.     this.wwrite("<style type='text/css'>\n<!--");
  151.  
  152.     for (i=0; i<12; i++) {
  153.  
  154.         vc = i % 3;
  155.  
  156.         if (i>=0 && i<= 2)    vr = 0;
  157.  
  158.         if (i>=3 && i<= 5)    vr = 1;
  159.  
  160.         if (i>=6 && i<= 8)    vr = 2;
  161.  
  162.         if (i>=9 && i<= 11)    vr = 3;
  163.  
  164.  
  165.  
  166.         vx = parseInt(vxf * vc) + vxm;
  167.  
  168.         vy = parseInt(vyf * vr) + vym;
  169.  
  170.  
  171.  
  172.         this.wwrite(".lclass" + i + " {position:absolute;top:" + vy + ";left:" + vx + ";}");
  173.  
  174.     }
  175.  
  176.     this.wwrite("-->\n</style>");
  177.  
  178.     this.wwrite("</head>");
  179.  
  180.  
  181.  
  182.     this.wwrite("<body " + 
  183.  
  184.         "link=\"" + this.gLinkColor + "\" " + 
  185.  
  186.         "vlink=\"" + this.gLinkColor + "\" " +
  187.  
  188.         "alink=\"" + this.gLinkColor + "\" " +
  189.  
  190.         "text=\"" + this.gTextColor + "\">");
  191.  
  192.     this.wwrite("<FONT FACE='" + fontface + "' SIZE=2><B>");
  193.  
  194.     this.wwrite("Year : " + this.gYear);
  195.  
  196.     this.wwrite("</B><BR>");
  197.  
  198.  
  199.  
  200.     // Show navigation buttons
  201.  
  202.     var prevYYYY = parseInt(this.gYear) - 1;
  203.  
  204.     var nextYYYY = parseInt(this.gYear) + 1;
  205.  
  206.  
  207.  
  208.     this.wwrite("<TABLE WIDTH='100%' BORDER=1 CELLSPACING=0 CELLPADDING=0 BGCOLOR='#e0e0e0'><TR><TD ALIGN=center>");
  209.  
  210.     this.wwrite("[<A HREF=\"" +
  211.  
  212.         "javascript:window.opener.Build(" + 
  213.  
  214.         "'" + this.gReturnItem + "', null, '" + prevYYYY + "', '" + this.gFormat + "'" +
  215.  
  216.         ");" +
  217.  
  218.         "\" alt='Prev Year'><<<\/A>]</TD><TD ALIGN=center>");
  219.  
  220.     this.wwrite("[<A HREF=\"javascript:window.print();\">Print</A>]</TD><TD ALIGN=center>");
  221.  
  222.     this.wwrite("[<A HREF=\"" +
  223.  
  224.         "javascript:window.opener.Build(" + 
  225.  
  226.         "'" + this.gReturnItem + "', null, '" + nextYYYY + "', '" + this.gFormat + "'" +
  227.  
  228.         ");" +
  229.  
  230.         "\">>><\/A>]</TD></TR></TABLE><BR>");
  231.  
  232.  
  233.  
  234.     // Get the complete calendar code for each month..
  235.  
  236.     var j;
  237.  
  238.     for (i=11; i>=0; i--) {
  239.  
  240.         if (isIE)
  241.  
  242.             this.wwrite("<DIV ID=\"layer" + i + "\" CLASS=\"lclass" + i + "\">");
  243.  
  244.         else if (isNav)
  245.  
  246.             this.wwrite("<LAYER ID=\"layer" + i + "\" CLASS=\"lclass" + i + "\">");
  247.  
  248.  
  249.  
  250.         this.gMonth = i;
  251.  
  252.         this.gMonthName = Calendar.get_month(this.gMonth);
  253.  
  254.         vCode = this.getMonthlyCalendarCode();
  255.  
  256.         this.wwrite(this.gMonthName + "-" + this.gYear + "<BR>");
  257.  
  258.         this.wwrite(vCode);
  259.  
  260.  
  261.  
  262.         if (isIE)
  263.  
  264.             this.wwrite("</DIV>");
  265.  
  266.         else if (isNav)
  267.  
  268.             this.wwrite("</LAYER>");
  269.  
  270.     }
  271.  
  272.  
  273.  
  274.     this.wwrite("</font><BR></body></html>");
  275.  
  276.     this.gWinCal.document.close();
  277.  
  278. }
  279.  
  280.  
  281.  
  282. Calendar.prototype.wwrite = function(wtext) {
  283.  
  284.     this.gWinCal.document.writeln(wtext);
  285.  
  286. }
  287.  
  288.  
  289.  
  290. Calendar.prototype.wwriteA = function(wtext) {
  291.  
  292.     this.gWinCal.document.write(wtext);
  293.  
  294. }
  295.  
  296.  
  297.  
  298. Calendar.prototype.cal_header = function() {
  299.  
  300.     var vCode = "";
  301.  
  302.  
  303.  
  304.     vCode = vCode + "<TR>";
  305.  
  306.     vCode = vCode + "<TD BGCOLOR='96aac8' WIDTH='14%'><FONT SIZE='2' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>Sun</B></FONT></TD>";
  307.  
  308.     vCode = vCode + "<TD BGCOLOR='96aac8' WIDTH='14%'><FONT SIZE='2' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>Mon</B></FONT></TD>";
  309.  
  310.     vCode = vCode + "<TD BGCOLOR='96aac8' WIDTH='14%'><FONT SIZE='2' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>Tue</B></FONT></TD>";
  311.  
  312.     vCode = vCode + "<TD BGCOLOR='96aac8' WIDTH='14%'><FONT SIZE='2' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>Wed</B></FONT></TD>";
  313.  
  314.     vCode = vCode + "<TD BGCOLOR='96aac8' WIDTH='14%'><FONT SIZE='2' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>Thu</B></FONT></TD>";
  315.  
  316.     vCode = vCode + "<TD BGCOLOR='96aac8' WIDTH='14%'><FONT SIZE='2' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>Fri</B></FONT></TD>";
  317.  
  318.     vCode = vCode + "<TD BGCOLOR='96aac8' WIDTH='16%'><FONT SIZE='2' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>Sat</B></FONT></TD>";
  319.  
  320.     vCode = vCode + "</TR>";
  321.  
  322.  
  323.  
  324.     return vCode;
  325.  
  326. }
  327.  
...
Expand|Select|Wrap|Line Numbers
  1.  
  2.  
  3. Calendar.prototype.cal_data = function() {
  4.  
  5.     var vDate = new Date();
  6.  
  7.     vDate.setDate(1);
  8.  
  9.     vDate.setMonth(this.gMonth);
  10.  
  11.     vDate.setFullYear(this.gYear);
  12.  
  13.  
  14.  
  15.     var vFirstDay=vDate.getDay();
  16.  
  17.     var vDay=1;
  18.  
  19.     var vLastDay=Calendar.get_daysofmonth(this.gMonth, this.gYear);
  20.  
  21.     var vOnLastDay=0;
  22.  
  23.     var vCode = "";
  24.  
  25.  
  26.  
  27.     /*
  28.  
  29.     Get day for the 1st of the requested month/year..
  30.  
  31.     Place as many blank cells before the 1st day of the month as necessary. 
  32.  
  33.     */
  34.  
  35.  
  36.  
  37.     vCode = vCode + "<TR>";
  38.  
  39.     for (i=0; i<vFirstDay; i++) {
  40.  
  41.         vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(i) + "><FONT SIZE='2' FACE='" + fontface + "'> </FONT></TD>";
  42.  
  43.     }
  44.  
  45.  
  46.  
  47.     // Write rest of the 1st week
  48.  
  49.     for (j=vFirstDay; j<7; j++) {
  50.  
  51.         vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j) + "><FONT SIZE='2' FACE='" + fontface + "'>" + 
  52.  
  53.             "<A HREF='#' " + 
  54.  
  55.                 "onClick=\"self.opener.document." + this.gReturnItem + ".value='" + 
  56.  
  57.                 this.format_data(vDay) + 
  58.  
  59.                 "';window.close();\">" + 
  60.  
  61.                 this.format_day(vDay) + 
  62.  
  63.             "</A>" + 
  64.  
  65.             "</FONT></TD>";
  66.  
  67.         vDay=vDay + 1;
  68.  
  69.     }
  70.  
  71.     vCode = vCode + "</TR>";
  72.  
  73.  
  74.  
  75.     // Write the rest of the weeks
  76.  
  77.     for (k=2; k<7; k++) {
  78.  
  79.         vCode = vCode + "<TR>";
  80.  
  81.  
  82.  
  83.         for (j=0; j<7; j++) {
  84.  
  85.             vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j) + "><FONT SIZE='2' FACE='" + fontface + "'>" + 
  86.  
  87.                 "<A HREF='#' " + 
  88.  
  89.                     "onClick=\"self.opener.document." + this.gReturnItem + ".value='" + 
  90.  
  91.                     this.format_data(vDay) + 
  92.  
  93.                     "';window.close();\">" + 
  94.  
  95.                 this.format_day(vDay) + 
  96.  
  97.                 "</A>" + 
  98.  
  99.                 "</FONT></TD>";
  100.  
  101.             vDay=vDay + 1;
  102.  
  103.  
  104.  
  105.             if (vDay > vLastDay) {
  106.  
  107.                 vOnLastDay = 1;
  108.  
  109.                 break;
  110.  
  111.             }
  112.  
  113.         }
  114.  
  115.  
  116.  
  117.         if (j == 6)
  118.  
  119.             vCode = vCode + "</TR>";
  120.  
  121.         if (vOnLastDay == 1)
  122.  
  123.             break;
  124.  
  125.     }
  126.  
  127.  
  128.  
  129.     // Fill up the rest of last week with proper blanks, so that we get proper square blocks
  130.  
  131.     for (m=1; m<(7-j); m++) {
  132.  
  133.         if (this.gYearly)
  134.  
  135.             vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j+m) + 
  136.  
  137.             "><FONT SIZE='2' FACE='" + fontface + "' COLOR='gray'> </FONT></TD>";
  138.  
  139.         else
  140.  
  141.             vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j+m) + 
  142.  
  143.             "><FONT SIZE='2' FACE='" + fontface + "' COLOR='gray'>" + m + "</FONT></TD>";
  144.  
  145.     }
  146.  
  147.  
  148.  
  149.     return vCode;
  150.  
  151. }
  152.  
  153.  
  154.  
  155. Calendar.prototype.format_day = function(vday) {
  156.  
  157.     var vNowDay = gNow.getDate();
  158.  
  159.     var vNowMonth = gNow.getMonth();
  160.  
  161.     var vNowYear = gNow.getFullYear();
  162.  
  163.  
  164.  
  165.     if (vday == vNowDay && this.gMonth == vNowMonth && this.gYear == vNowYear)
  166.  
  167.         return ("<FONT COLOR=\"RED\"><B>" + vday + "</B></FONT>");
  168.  
  169.     else
  170.  
  171.         return (vday);
  172.  
  173. }
  174.  
  175.  
  176.  
  177. Calendar.prototype.write_weekend_string = function(vday) {
  178.  
  179.     var i;
  180.  
  181.  
  182.  
  183.     // Return special formatting for the weekend day.
  184.  
  185.     for (i=0; i<weekend.length; i++) {
  186.  
  187.         if (vday == weekend[i])
  188.  
  189.             return (" BGCOLOR=\"" + weekendColor + "\"");
  190.  
  191.     }
  192.  
  193.  
  194.  
  195.     return "";
  196.  
  197. }
  198.  
  199.  
  200.  
  201. Calendar.prototype.format_data = function(p_day) {
  202.  
  203.     var vData;
  204.  
  205.     var vMonth = 1 + this.gMonth;
  206.  
  207.     vMonth = (vMonth.toString().length < 2) ? "0" + vMonth : vMonth;
  208.  
  209.     var vMon = Calendar.get_month(this.gMonth).substr(0,3).toUpperCase();
  210.  
  211.     var vFMon = Calendar.get_month(this.gMonth).toUpperCase();
  212.  
  213.     var vY4 = new String(this.gYear);
  214.  
  215.     var vY2 = new String(this.gYear.substr(2,2));
  216.  
  217.     var vDD = (p_day.toString().length < 2) ? "0" + p_day : p_day;
  218.  
  219.  
  220.  
  221.     switch (this.gFormat) {
  222.  
  223.         case "MM\/DD\/YYYY" :
  224.  
  225.             vData = vMonth + "\/" + vDD + "\/" + vY4;
  226.  
  227.             break;
  228.  
  229.         case "MM\/DD\/YY" :
  230.  
  231.             vData = vMonth + "\/" + vDD + "\/" + vY2;
  232.  
  233.             break;
  234.  
  235.         case "MM-DD-YYYY" :
  236.  
  237.             vData = vMonth + "-" + vDD + "-" + vY4;
  238.  
  239.             break;
  240.  
  241.         case "MM-DD-YY" :
  242.  
  243.             vData = vMonth + "-" + vDD + "-" + vY2;
  244.  
  245.             break;
  246.  
  247.  
  248.  
  249.         case "DD\/MON\/YYYY" :
  250.  
  251.             vData = vDD + "\/" + vMon + "\/" + vY4;
  252.  
  253.             break;
  254.  
  255.         case "DD\/MON\/YY" :
  256.  
  257.             vData = vDD + "\/" + vMon + "\/" + vY2;
  258.  
  259.             break;
  260.  
  261.         case "DD-MON-YYYY" :
  262.  
  263.             vData = vDD + "-" + vMon + "-" + vY4;
  264.  
  265.             break;
  266.  
  267.         case "DD-MON-YY" :
  268.  
  269.             vData = vDD + "-" + vMon + "-" + vY2;
  270.  
  271.             break;
  272.  
  273.  
  274.  
  275.         case "DD\/MONTH\/YYYY" :
  276.  
  277.             vData = vDD + "\/" + vFMon + "\/" + vY4;
  278.  
  279.             break;
  280.  
  281.         case "DD\/MONTH\/YY" :
  282.  
  283.             vData = vDD + "\/" + vFMon + "\/" + vY2;
  284.  
  285.             break;
  286.  
  287.         case "DD-MONTH-YYYY" :
  288.  
  289.             vData = vDD + "-" + vFMon + "-" + vY4;
  290.  
  291.             break;
  292.  
  293.         case "DD-MONTH-YY" :
  294.  
  295.             vData = vDD + "-" + vFMon + "-" + vY2;
  296.  
  297.             break;
  298.  
  299.  
  300.  
  301.         case "DD\/MM\/YYYY" :
  302.  
  303.             vData = vDD + "\/" + vMonth + "\/" + vY4;
  304.  
  305.             break;
  306.  
  307.         case "DD\/MM\/YY" :
  308.  
  309.             vData = vDD + "\/" + vMonth + "\/" + vY2;
  310.  
  311.             break;
  312.  
  313.         case "DD-MM-YYYY" :
  314.  
  315.             vData = vDD + "-" + vMonth + "-" + vY4;
  316.  
  317.             break;
  318.  
  319.         case "DD-MM-YY" :
  320.  
  321.             vData = vDD + "-" + vMonth + "-" + vY2;
  322.  
  323.             break;
  324.  
  325.         case "YYYY-MM-DD" :
  326.  
  327.             vData = vY4 + "-" + vMonth + "-" + vDD;
  328.  
  329.             break;
  330.  
  331.  
  332.  
  333.         default :
  334.  
  335.         //    vData = vMonth + "\/" + vDD + "\/" + vY4;
  336.  
  337.             vData = vY4 +"-"+vMonth + "-" + vDD ;
  338.  
  339.     }
  340.  
  341.  
  342.  
  343.     return vData;
  344.  
  345. }
  346.  
  347.  
  348.  
  349. function Build(p_item, p_month, p_year, p_format) {
  350.  
  351.     var p_WinCal = ggWinCal;
  352.  
  353.     gCal = new Calendar(p_item, p_WinCal, p_month, p_year, p_format);
  354.  
  355.  
  356.  
  357.     // Customize your Calendar here..
  358.  
  359.     gCal.gBGColor="white";
  360.  
  361.     gCal.gLinkColor="black";
  362.  
  363.     gCal.gTextColor="black";
  364.  
  365.     gCal.gHeaderColor="darkgreen";
  366.  
  367.  
  368.  
  369.     // Choose appropriate show function
  370.  
  371.     if (gCal.gYearly)    gCal.showY();
  372.  
  373.     else    gCal.show();
  374.  
  375. }
  376.  
  377.  
  378.  
  379. function show_calendar() {
  380.  
  381.     /* 
  382.  
  383.         p_month : 0-11 for Jan-Dec; 12 for All Months.
  384.  
  385.         p_year    : 4-digit year
  386.  
  387.         p_format: Date format (mm/dd/yyyy, dd/mm/yy, ...)
  388.  
  389.         p_item    : Return Item.
  390.  
  391.     */
  392.  
  393.  
  394.  
  395.     p_item = arguments[0];
  396.  
  397.     if (arguments[1] == null)
  398.  
  399.         p_month = new String(gNow.getMonth());
  400.  
  401.     else
  402.  
  403.         p_month = arguments[1];
  404.  
  405.     if (arguments[2] == "" || arguments[2] == null)
  406.  
  407.         p_year = new String(gNow.getFullYear().toString());
  408.  
  409.     else
  410.  
  411.         p_year = arguments[2];
  412.  
  413.     if (arguments[3] == null)
  414.  
  415.         p_format = "YYYY-MM-DD";
  416.  
  417.     else
  418.  
  419.         p_format = arguments[3];
  420.  
  421.  
  422.  
  423.     vWinCal = window.open("", "Calendar", 
  424.  
  425.         "width=250,height=250,status=no,resizable=no,top=200,left=200");
  426.  
  427.     vWinCal.opener = self;
  428.  
  429.     ggWinCal = vWinCal;
  430.  
  431.  
  432.  
  433.     Build(p_item, p_month, p_year, p_format);
  434.  
  435. }
  436.  
  437. /*
  438.  
  439. Yearly Calendar Code Starts here
  440.  
  441. */
  442.  
  443. function show_yearly_calendar(p_item, p_year, p_format) {
  444.  
  445.     // Load the defaults..
  446.  
  447.     if (p_year == null || p_year == "")
  448.  
  449.         p_year = new String(gNow.getFullYear().toString());
  450.  
  451.     if (p_format == null || p_format == "")
  452.  
  453.         p_format = "YYYY-MM-DD";
  454.  
  455.  
  456.  
  457.     var vWinCal = window.open("", "Calendar", "scrollbars=yes");
  458.  
  459.     vWinCal.opener = self;
  460.  
  461.     ggWinCal = vWinCal;
  462.  
  463.  
  464.  
  465.     Build(p_item, null, p_year, p_format);
  466.  
  467. }

With regards,
kumuda
JosAH's Avatar
Expert
  
Join Date: Mar 2007
Posts: 10,611
#2: Feb 28 '08

re: changing color of calendar dates

@all readers: please press the 'reply' link to be able to read the original post.
It contains the correct tags (both html and forum tags) but for some buggy
reasons the forum software can't handle it. On behalf of the forum software I
apologize for the inconvenience.

kind regards,

Jos (mod)
ronverdonk's Avatar
Moderator
  
Join Date: Jul 2006
Location: The Netherlands
Posts: 4,139
#3: Feb 28 '08

re: changing color of calendar dates

Quote:

Originally Posted by JosAH

@all readers: please press the 'reply' link to be able to read the original post.
It contains the correct tags (both html and forum tags) but for some buggy
reasons the forum software can't handle it. On behalf of the forum software I
apologize for the inconvenience.

kind regards,

Jos (mod)

500 lines of code plus 500 blank lines is a lot of code!

Ronald
Member
  
Join Date: Jan 2008
Posts: 59
#4: Feb 28 '08

re: changing color of calendar dates

Hi all, now I have removed the blank lines I hope you can view the content. if not please click reply button to view
Member
  
Join Date: Oct 2007
Posts: 110
#5: Mar 1 '08

re: changing color of calendar dates

I took a quick look at your code, but I think posting that much code is WAY too much for anybody to go through, particularly without comments. I've been guilty of the same recently, and it was suggested to me not to include so much code that a reader has to scroll to view it.

However, I did a search for "id'"s and "class"es, and I don't see anywhere where you set the id or class of an element where the date has a result. It seems you only have one id and one class for data. How are you setting the date to green if their is an entry?

I have also done a search for "select", and it seems you don't include your mysql query in your code.

So, those are the two things that are needed as far as I can tell. Your query looks for the result, if their is a result, then you set the id or class of the resulting date to go green.

You would probably also want to create an ajax update for when the user enters new data. To do that, I use jquery, and put the date in the id, then refresh the data on that id.

I hope that helps.

Pete
Reply

« previous question | next question »

Similar PHP bytes

/bytes/development

/bytes/it

/bytes/about

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over 226,272 network members.

dev questions:
algorithms | asp | asp.net | c/c++ | coldfusion | c# | flash | html/css | java | javascript |
mobile dev | .net | perl | php | python | ruby | software dev | vb.net | visual basic | xml
it questions:
access | apache | careers | db2 | iis | macosx | mysql | networking | oracle | postgresql | sql server | unix | windows

About Bytes | Copyright 1995-2009 BYTES. All rights Reserved