nicht angemeldet
Hallo,
ich fasse die bisherigen Erkenntnisse aus diesem und dem gesperrten Thread zum gleichen Thema zusammen. Ich hoffe, dass wir somit zu einem Ergebnis kommen werden.
Hut ab, dass Du Dir die Mühe gemacht hast! Und soweit ich das überblicke, hast Du beim Zusammenfassen die Dinge korrekt sortiert.
ein guter Ausgangspunkt.
Außerdem ist zu berücksichtigen, dass Du aufgrund eines Klicks auf ein Element in der Spalte "Name" auf Elemente in der Spalte "Checkboxen" zugreifen willst (3. Beitrag von Dir). Dies ist eine wesentliche Erweiterung zu Deinen ersten beiden Beiträgen, die jeweils *genau ein* Element zum Aktivieren/Deaktivieren der Checkboxen einer Gruppe suggerierten.
Ich bin ein echter Noob in Javascript,
das war jeder einmal. Das ist keine Schande. Du bist jedoch der einzige, der für Dich diesen Zustand ändern kann.
ich hätte nicht gedacht, dass es einen Unterschied macht. Man kann doch ebventhandler auch an einen Link anhängen?
klar kann man das. Es ist jedoch ein Unterschied, ob in der gleichen Zeile etwas zu tun ist, oder ob unterhalb der Tabelle diese gesammelte Funktionalität in einer Liste zu implementieren ist. So wie es ist, ist es einfacher :-)
Ganz bestimmt gibt es zu jedem Namen eine entsprechende ID in Deiner Datenbank, die Du mit abfragen kannst.[...] Diese ganze Zahl, versehen mit zwei unterschiedlichen Präfixen könntest Du nutzen, um sowohl Namen als auch Checkboxen zu *klassifizieren*. Aus der Klasse des angeklickten Namens ergibt sich somit der Klassenname der anzuhakenden Checkboxen.
Was meinst Du genau mit Checkbox klassifizieren? So richtig class='abc'?
genau das. Deswegen verwendete ich den Begriff "klassifizieren" statt "gruppieren". "klassifizieren" passt auf das Problem, somit ist es sinnvoll, Klassen zu verwenden - und kein Missbrauch von Klassen :-)
Warum ich 2 Präfixe brauche, versteh ich auch nicht.
Du brauchst keine zwei Präfixe. Unterschiedliche Präfixe sind sinnvoll, wenn man getElementByClassName() - oder Frameworks mit Selektorengines - verwendet, weil man darüber genau die Liste der gewünschten Checkboxen bekommt.
Man kann doch ebventhandler auch an einen Link anhängen?
Klar kann man das. Aber Du benötigst keinen Link, um einen onclick-Event zu bekommen.
Gehen wir von folgendem HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Checkboxen aktivieren</title>
</head>
<body>
<h1>Mailliste</h1>
<form action="" name="mailliste">
<table>
<tr>
<th>Absender</th>
<th>Aktion</th>
</tr>
<tr>
<td>Max Mustermann</td>
<td><input type="checkbox" name="arr_mail[]" value="irgendwas"></td>
</tr>
<tr>
<td>Michaela Musterfrau</td>
<td><input type="checkbox" name="arr_mail[]" value="anderes"></td>
</tr>
<tr>
<td>Max Mustermann</td>
<td><input type="checkbox" name="arr_mail[]" value="irgendwas"></td>
</tr>
</table>
</form>
</body>
</html>
und den dazugehörigen Daten
id | Absender
-----------------------------
17 | Max Mustermann
24 | Michaela Musterfrau
aus, so können wir die von Dir gewünschte Funktionalität (wie von mir beschrieben, reduziert auf ein Präfix "p") so erzielen:
1. Die td-Elementen der Namensspalte
- erhalten die Klasse <präfix><id>
- bekommen einen onclick-Handler
- ein title-Attribut, dass den Benutzer über die erweiterte Funktionalität
informiert
2. Die Checkboxen erhalten die Klasse <präfix><id>
<tr>
<td class="p17" onclick="checkAll([ref:self812;javascript/sprache/objekte.htm#this@title=this])" title="Anklicken markiert alle Mails dieses Absenders">Max Mustermann</td>
<td><input type="checkbox" name="arr_mail[]" value="irgendwas" class="p17"></td>
</tr>
3. Schreiben der Handlerfunktion
Es gibt verschiedene Wege, die betreffenden Checkboxen herauszufinden,
zum Beispiel:
a) die zu aktivierenden Checkboxen sind in der Liste der Checkboxen
mit dem Namen arr_mail[] enthalten. Diese Liste erhalten wir mit
http://de.selfhtml.org/javascript/objekte/document.htm#get_elements_by_name@title=getElementsByName(). Weiter verfügen diese Elemente über die gleiche
Klasse wie das angeklickte Element. Auf die Klasse können wir mit
der Eigenschaft http://de.selfhtml.org/javascript/objekte/all.htm#class_name@title=className zugreifen.
b) Iterieren über sämtliche Formularelemente des Formulars, siehe
SELFHTML, Objekt http://de.selfhtml.org/javascript/objekte/elements.htm@title=elements. Es sind die Elemente vom Typ checkbox
(Eigenschaft http://de.selfhtml.org/javascript/objekte/elements.htm#type@title=type) mit der gleichen Klasse wie das angeklickte
Element von Interesse (wie in a) className).
c) Bei unterschiedlichen Präfixen bei Absender und Checkbox:
Ermittle aus Absenderklasse die relevante Checkboxenklasse.
Ermittle die gewünschten Knoten mit getElementsByClassName.
So könnte man a) umsetzen:
/**
* Aktiviert die Checkbox bei allen Mails des gleichen Absenders
* <b>checkAll</b>
*
* @param el {object} Objekt (td-Element), das angeklickt wurde
*/
function checkAll(el) {
// Ermittle die Liste der Checkboxen mit dem gewünschten Namen
var allCheckBoxes = document.[ref:self812;javascript/objekte/document.htm#get_elements_by_name@title=getElementsByName]("arr_mail[]");
// Durchlaufe diese Liste
for (var i = 0; i < allCheckBoxes.[ref:self812;javascript/objekte/array.htm#length@title=length]; i++) {
// und prüfe ob die aktuelle Checkbox die richtige Klasse aufweist
if (allCheckBoxes[i].[ref:self812;javascript/objekte/all.htm#class_name@title=className] == el.className) {
allCheckBoxes[i].[ref:self812;javascript/objekte/elements.htm#checked@title=checked] = true;
}
}
}
Freundliche Grüße
Vinzenz
PS: Die Verlinkung von className verursachte leichte Bauchschmerzen :-(
document.all.className dürfte nur für IE4 erforderlich sein - und der ist mausetot.