nicht angemeldet
Alle Checkboxen einer Spalte umschalten
Moin!
Randbedingungen wie bei mir üblich: Es geht um eine Applikation die nur mit JavaScript funktioniert und nur auf Gecko Browsern unterstützt ist.
Meine HTML Seiten werden per XSLT generiert. Nun kommt es manchmal vor, daß in einer Spalte einer Tabelle Checkboxen stehen. Diese würde ich gerne über eine weitere Checkbox "auf einen Schlag" (de)aktivieren können.
Gelöst habe ich das im Moment wie folgt:
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
<script type="text/javascript">
function toggleAllCheckBoxes(cb, name) {
var cell= getParent( cb, /^(?:TH|TD)$/i );
var column= cell.cellIndex;
var table= getParent( cell, /^TABLE$/i );
var cbs= document.getElementsByName( name );
for ( var i= cbs.length ; i-- ; ) with ( cbs[i] ) {
if ( tagName != 'INPUT' ) continue;
if ( type != 'checkbox' ) continue;
if ( table != getParent( cbs[i], /^TABLE$/i ) ) continue;
checked= cb.checked;
}
}
function getParent( node, pattern ) {
while ( node ) {
if ( node.tagName.search( pattern ) > -1 ) break;
node= node.parentNode;
}
return node;
}
</script>
<title>Request</title>
</head>
<body>
<form action="submitted.html" id="theForm" method="post">
<table>
<caption>EMEA</caption>
<tfoot>
<tr>
<th>
<input type="checkbox" onchange="toggleAllCheckBoxes(this, 'hostid')" name="toggleAllCheckbox"></input>
</th>
<td colspan="4">
All
</td>
</tr>
</tfoot>
<thead>
<tr>
<th>Request?</th>
<th>Host ID</th>
<th>Host Name</th>
<th>Type</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr>
<th>
<input name="hostid" type="checkbox" value="4711"/>
</th>
<td>4711</td>
<td>Something</td>
<td>System</td>
<td>2005.10.23 09:30</td>
</tr>
<tr>
<th>
<input name="hostid" type="checkbox" value="0815"/>
</th>
<td>0815</td>
<td>Else</td>
<td>Cluster</td>
<td>2006.01.13 09:30</td>
</tr>
<tr>
<th>
<input name="hostid" type="checkbox" value="42"/>
</th>
<td>42</td>
<td>Deep Thought</td>
<td>Gigant</td>
<td>2006.11.13 11:30</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
Im Moment löse ich es also so, daß ich toggleAllCheckboxes den Namen der Checkboxen übergebe (der immer gleich sein muß) und anschließend alle Objekte dieses Namens daraufhin überprüfe, ob sie:
1. Ein INPUT Element
2. vom Typ checkbox sind
3. und in derselben Tabelle liegen, wie die toggle-Checkbox
Kennt hier jemand eine elegantere Methode?
-- Skeeve
-
Hallo,
Im Moment löse ich es also so, daß ich toggleAllCheckboxes den Namen der Checkboxen übergebe (der immer gleich sein muß) und anschließend alle Objekte dieses Namens daraufhin überprüfe, ob sie:
- Ein INPUT Element
Kann man besser lösen, indem man vom FORM ausgeht und dessen elements Collection durchläuft. Das FORM eines Elements, in Deinem Fall der Checkbox, erhält man mit [Element].form.
- vom Typ checkbox sind
Das muss man nur prüfen, wenn es andere Formularelemente mit dem selben Namen geben kann. Das würde aber auch die serverseitige Auswertung fast unmöglich machen, weil die name/value-Paare übertragen werden.
- und in derselben Tabelle liegen, wie die toggle-Checkbox
Das wäre nur relevant, wenn es mehrere Tabellen im selben Formular geben kann. Ist das so?
Kennt hier jemand eine elegantere Methode?
Wenn die Antworten auf meine Fragen zu 2. und 3. nein lauten, dann:
function toggleAllCheckBoxes(cb, form, name) { var cbs = form.elements[name]; for ( var i = cbs.length ; i-- ; ) with ( cbs[i] ) { if ( type != 'checkbox' ) continue; checked = cb.checked; } }... <input type="checkbox" onclick="toggleAllCheckBoxes(this, this.form, 'hostid')" name="toggleAllCheckbox"></input> ...viele Grüße
Axel
-
Hallo,
Wenn die Antworten auf meine Fragen zu 2. und 3. nein lauten, dann:
> function toggleAllCheckBoxes(cb, form, name) { > var cbs = form.elements[name]; > for ( var i = cbs.length ; i-- ; ) > with ( cbs[i] ) { > checked = cb.checked; > } > }> ... > <input type="checkbox" onclick="toggleAllCheckBoxes(this, this.form, 'hostid')" name="toggleAllCheckbox"></input> > ...Die Prüfung auf type="checkbox" kann natürlich auch noch raus.
viele Grüße
Axel
-
Moin!
Kann man besser lösen, indem man vom FORM ausgeht und dessen elements Collection durchläuft.
Ich war davon ausgegangen, daß es auf den künftigen Seiten (das war ja nur ein Beispiel) deutlich mehr Elemente gibt, als objekte mit dem Namen. Insofern sollte der Zugriff über den Namen schneller sein, da weniger abzuarbeiten ist.
- vom Typ checkbox sind
Das muss man nur prüfen, wenn es andere Formularelemente mit dem selben Namen geben kann. Das würde aber auch die serverseitige Auswertung fast unmöglich machen, weil die name/value-Paare übertragen werden.
Guter Einwand!
- und in derselben Tabelle liegen, wie die toggle-Checkbox
Das wäre nur relevant, wenn es mehrere Tabellen im selben Formular geben kann. Ist das so?
Das kann sein, und ist im Original auch der Fall.
Vielen Dank für Deine Antwort!
-- Skeeve-
Hallo,
Kann man besser lösen, indem man vom FORM ausgeht und dessen elements Collection durchläuft.
Ich war davon ausgegangen, daß es auf den künftigen Seiten (das war ja nur ein Beispiel) deutlich mehr Elemente gibt, als objekte mit dem Namen. Insofern sollte der Zugriff über den Namen schneller sein, da weniger abzuarbeiten ist.Nein, denn meine Methode durchläuft auch nur alle Elemente mit dem bestimmten Namen.
- und in derselben Tabelle liegen, wie die toggle-Checkbox
Das wäre nur relevant, wenn es mehrere Tabellen im selben Formular geben kann. Ist das so?
Das kann sein, und ist im Original auch der Fall.
Ist aber nach nochmaligem Nachdenken irrelevant, weil die Elemente in den anderen Tabelle in selben Formular dann auch wieder andere Namen haben müssten, wegen der serverseitigen Auswertung.
viele Grüße
Axel
-
Moin!
Nein, denn meine Methode durchläuft auch nur alle Elemente mit dem bestimmten Namen.
Jetzt, wo Du es sagst, fällt es mir auch auf.
Das kann sein, und ist im Original auch der Fall.
Ist aber nach nochmaligem Nachdenken irrelevant, weil die Elemente in den anderen Tabelle in selben Formular dann auch wieder andere Namen haben müssten, wegen der serverseitigen Auswertung.Im Prinzip schon, aber, die Unterteilung in Tabellen erfolgt aufgrund eines gemeinsamen Kriteriums der Tabellenzeilen. Die serverseitige Auswertung muß darauf keine Rücksicht nehmen, d.h. für den Server ist es irrelevant, aus welcher Tabelle die Elemente kommen. Für den Nutzer ist die Unterteilung aber wichtig und nützlich.
-- Skeeve
- und in derselben Tabelle liegen, wie die toggle-Checkbox
- vom Typ checkbox sind