conditional formatting bgcolor in teen tabel

[gewillig]

Ik heb een vraag in verband met contitionele formatering van bgcolor in een tabel.

Stel ik heb een tabel met volgende info:

Lijn 1 cel 1 ; 15/04/2009
Lijn 1 cel 2 : Taak1

Lijn 2 cel 1 : 16/04/2009
Lijn 2 cel 2 : Taak2

Mijn bedoeling is om de achtergrond van de lijn te laten veranderen naar een bepaalde kleur als de datum in kwestie voorbij is.

Zou iemand mij hiermee kunnen helpen want ik ben echt lost in space

 

[That Guy]

geef je tabel een id, bijvoorbeeld 'datumtabel'. Dus zoiets:

<table id='datumtabel'>
<tr> <td>18/04/2009</td> <td> taak 1</td> </tr>
<tr> <td>20/04/2009</td> <td> taak 2</td> </tr>
</table>

Nu ga je t id opzoeken, de tr's eruit vissen, en dan de td's in een loopje kleuren.
Zoiets:

//javascripts

var table = document.getElementById('datumtabel');
var trs = table.getElementsByTagName('tr');

for(var i=0;i<trs.length;i++){
   var tds = trs[i].getElementsByTagName('td');
   if( doeIetsMetDeDatum(tds[0].innerHTML) == true){
      tds[i].style.backgroundColor = '#f00';
   }
}

(regel 8, tds[0].innerHTML: van alle td's in de rij van deze tr, pak je de 1e (dus 0 in de array) en pak je daarvan de waarde die erin staat (<td>bla</td> is dan dus 'bla'))

je functie doeIetsMetDeDatum zal dus het omzetten bevatten, en het vergelijken. Zoiets:

//javascripts
function doeIetsMetDeDatum(value)
{
   var now = ....;
   var formatvalue = doe_iets_leuks_met_js(value);

   if(now > formatvalue){
      return true;
   }else{
      return false;
   }
}

(even voor t idee)

:thumb:

 

[ScorpionX]

Heey,
Oke, stel dit is je tabel:

<table border="1" id="tabel1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>

dan zou dit de code zijn om de achtergrondkleur te veranderen:

<script type="text/javascript">
Document.getElementById('tabel1').style.backgroundColor="#F0EDD6'";
</script>

Maar je wil het natuurlijk met een voorwaarde doen. we willen de huidige datum vergelijken met de ingevulde datum. allereerst moeten we de huidige datum opvragen.

<script type="text/javascript">
var currentTime = new Date()
var month = currentTime.getMonth() + 1
var day = currentTime.getDate()
var year = currentTime.getFullYear()
document.write(day + "/" + month + "/" + year)

en daarna moet je de datum in de cellen opsplitsen in dag maand jaar, om te vergelijken met de huidige datum. dat doe je zo:

<script type="text/javascript">
function test(){
var value1 = "15/04/2009";
var firstIndex = value1.indexOf('/');
var lastIndex = value1.lastIndexOf('/');
month1 = value1.substring (0, firstIndex);
date1 = value1.substring (firstIndex+1, lastIndex);
year1 = value1.substring (lastIndex+1, value1.length);
document.write(month1 + "<br>" +date1 + "<br>" + year1);
}
test();
</script>

Het enige wat je nog te doen staat is de if statement te bouwen, ik denk dat dat wel goed komt. suc6