JavaScript Highlight table <tr> wenn checkbox == checked

Twisterking

Lt. Commander
Registriert
Jan. 2004
Beiträge
1.726
Hi all!

Habe n kleines Problem hier ...
Ne table mit einigen <tr>'s ... pro tr gibts eine checkbox mit ner eindeutigen id nämlich einfach nur "id" ... jedes TR hat die dazupassende id "tr_" + id;
Hoffe is klar wies gemeint is! :)

Ich will nun immer wenn die checkbox checked is die jeweilige tr anders einfärben (CSS)!
leider funzt das nicht so ganz. Beim ersten mal gehts, aber wenn ich das häckchen wieder wegnehme färbt sich die TR NICHT wieder normal! Was is falsch!?? :(

Achja ... der dojo-spezifische code is schon richtig so, an meiner if-schleife muss was faul sein!

Code:
Checkbox:
<input type='checkbox' name='checkboxes' id='" + id + "' onclick='highlighttr(" + id +  ");'>

TR:
dojo.byId("dataOutput").rows[0].id = "tr_" + id;

Bis hierhin sollte eig. alles ok sein!
Nun die eigentlich "highlightr"-function:

Code:
var highlighttr = function (id) {
	var currenttr = "tr_" + id;
	var currentcb = dojo.byId(id);
	if (currentcb.checked) {
		dojo.style(dojo.byId(currenttr), "background", "green");
	} else {
		dojo.style(dojo.byId(currenttr), "background", "yellow");
	}
};

Hoffe mir kann wer helfen! :)

mfg
Twist
 
1. if-schleifen gibt es nicht.
2. der code der zeile bzw. tabelle wär schon nicht schlecht, denn wenn du uns nur die checkbox gibst, können wir herzlich wenig damit anfangen.
3. was sagt die javascript konsole? hast du firefox (firebug)? dann verwende mal bitte console.log( <string> ); zum debuggen.

ich hatte letztens auch so ein problem mit checkboxen und hab mir damit dann abhilfe geschafft:
Code:
onClick="javascript:if( this.value == '0' ) this.value = '1'; else this.value = '0';"
hab im nachhinein dann nur auf den wert geprüft.

edit: valides html sieht aber anders aus. ;)
HTML:
<input type="checkbox" name="checkboxes" id="' + id + '" onclick="highlighttr(' + id +  ');">

edit 2: du könntest auch mit der dom arbeiten, was imo um einiges einfacher und flexibler ist.
HTML:
<input ... onClick="javascript:highlighttr(this, this.parentNode.parentNode)" />
...
function highlighttr( Sender, Node )
{
  if( Sender.value == '0' )
  {
    Sender.value = '1';
    Node.setAttribute( 'style', 'background: #fff;' );
  }
  else
  {
    Sender.value = '0';
    Node.setAttribute( 'style', 'background: #000;' );
  }
}
aber ich weiß ja nicht, ob du zwangsweise auf dojo angewiesen sein willst.
 
Zuletzt bearbeitet:
Der letzte Code hat auf Anhieb super funktioniert, danke für die Hilfe! :)
 

Ähnliche Themen

Zurück
Oben