views:

676

answers:

4

Hi All, I know it can be done but am having issues getting it to work. Basically I want to change the font color of a specific table cell based on a variable which changes daily, in effect highlighting the day of the week in a calendar. I know that a variable can be used to get the element id but what am I missing here? I have tried using a unique DIV inside each cell but get the same error - "Object Required". Thanks in advance. Here is the code:

<style>

td#day1{color:white;} td#day2{color:white;} td#day3{color:white;} td#day4{color:white;} etc..

<script type="text/javascript">
function calculate_date(){
    currentTime = new Date();
    day = currentTime.getDate();
    return day;
    }
function highlight_day() {
    calculate_date(); 
    today = 'day'+ day;
    document.getElementById(today).style.color= "red";
    }
document.onload(highlight_day());
</script>
</head>
<body>
SEPTEMBER
<table class="cal">
<tr>
<td id="day1">1</td><td id="day2">2</td><td id="day3">3</td><td id="day4">4</td>
+6  A: 

Change this line:

calculate_date();

to:

var day = calculate_date();

The error you are getting is because 'day' does not exist within the current scope.

DaRKoN_
+8  A: 

This function is incorrect:

function highlight_day() {
  calculate_date(); 
  today = 'day'+ day;
  document.getElementById(today).style.color= "red";
}

The 'day' variable is not set anywhere. You probably wanted this:

function highlight_day() {
  var day = calculate_date(); 
  var today = 'day'+ day;
  document.getElementById(today).style.color= "red";
}
too much php
A: 

Thanks for the help guys. I have added your recommendations and also moved the call of the highlight_day() function to after the table and it works! Thanks again.

Dave
Dave, you might also want to add logic to remove the coloring of the previous day as well. When a switch occurs, it looks like both dates will be colored red.
David Andres
You might also want to accept one of the answers so that points are awarded.
Nerdling
To further explain the system: you've now officially "answered your own question" - except, you didn't really. You're using answers as comments, which is not how the system is built. When you find an answer that solves your problem, you click the check mark - and if you want to say thanks, click "add comment" on the answer you selected. That way, the person who solved your problem gets reputation points, and everyone is happy!
Matchu
What about accepting one of them as an answer by simply clicking the check button.
Braveyard
Have now accepted the answer. Sorry for the delay.
Dave
A: 

HeatColor is an interesting jQuery plugin I came across which you might find useful.

http://www.jnathanson.com/blog/client/jquery/heatcolor/index.cfm

kobra