Tabellenfarbe / Checkbox mit onclick ändern

Computer: Software & Programmierung JavaScript & Script-Sprachen
#1

Hallo JS-Profis,

ich habe mal wieder eine Frage zu JS.
Folgende Aufgabe :

Ich habe eine dynamische Tabelle mit Informationen. In jeder Zeile ist eine Checkbox enthalten.
Durch aktivieren der Checkbox wird ein Wert hinterlegt, der dann später für Auswertungen benötigt wird.
Soweit funktioniert das alles.

Um die Tabelle beim betrachten übersichtlicher zu gestalten, möchte ich, dass bei einem onclick in der Tabellenzeile die Checkbox aktiviert wird und/oder sich die Hintergrundfarbe in der Tabellenzeile ändert.
Das dürfte ja eigentlich nur mit Javascript funktionieren.
Da ich aber von JS keine Ahnung habe, wäre es super wenn ihr mir vielleicht helfen könntet.

Vielen Dank im voraus.

Gruß

Bob

#2

…kleine Ergänzung

also das mit der Checkboxmarkierung habe ich hinbekommen.
Das funzt mit
Was fehlt ist das JS für den Farbwechsel.
Könnt ihr helfen ?

Bob

#3

bzw statt „this“ dann element-id

mfg
Julian

#4

grad nochmal gelesen… background ist natürlich nicht color sondern:

Julian

#5

Vielleicht so…
probier es mal folgendermaßen:

 var myOldObject = "";
 function colorizeTD(myObject){
 if (myOldObject != ""){
 myOldObject.style.background = "#ffffff"
 }
 myObject.style.background="#0000ff";
 myOldObject = myObject;
 }

irgendwas

irgendwas

Das Beispiel macht das, was du willst. Wichtig für dich wäre, den
‚onclick="…"‘-Teil zu übernehmen sowie den Scriptteil im head-
Bereich, dann müßte es funktionieren. Falls nicht, einfach noch mal
melden. Natürlich muß man dann auch noch Funktionen einbauen um die
Inhalte der jeweiligen Tabellenfelder auszulesen oder was auch immer
du damit vorhast.
Falls du willst, dass nur die zeile hervorgehoben wird, bei der der
Radiobutton auch tatsächlich abgehakt ist muß man das Ganze noch ein
wenig ummodeln.

#6

Noch was zur Ergänzung…
Es gäbe noch eine kleine Vereinfachung:

Du könntest die onclick-handler auch aus den td-tags rausnehmen und
stattdessen nur in den tr-tags einfügen. Dann muß allerdings
„this.parentNode“ jeweils durch „this“ ersetzt werden. Spart halt
etwas Code. So sollten die geänderten Abschnitte dann aussehen:

 irgendwas

Und (nur der Ordnung halber) sollte die Funktion sowie deren Aufruf
dann vielleicht in „colorizeTR“ umbenannt werden… :smile:

#7

Beispiel
Hallo Bob,

hier ein Beispiel wie Du es lösen könntest. Die TD-Tags nutzen ID (bspw. Daten0101) um auf den Checkbox-Namen (bspw. cb0101) zuzugreifen und dann ggf. die Farbe zu wechseln.

\<!--
 function f\_chgbgcolor( oObject ) {
 oObject.bgColor = document.forms.info["cb".concat( oObject.id.substr( 5 ) )].checked?"#00ff00":"#eeeeee";
 return
 } // f\_chgbgcolor

//--\>

Gruß

Christian