Felder mehrmals anklicken

[sailing]

Hallo zusammen!

Jetziger Stand meiner Arbeit:

echo("<div onclick=\"document.getElementById('answer1').checked=true\">dddddd</div>");  
  
echo("<input type=\"checkbox\" id=\"answer1\" name=\"form1\" \"/>");  
  

Ziel ist es aber, dass jedes Mal wenn der Text angeklickt wird, sich die Checkbox verändert. Ist das möglich?
Probiere wirklich schon Tage aus, bekomme es aber nicht hin!

Gruß
sailing

[ChrisB]

Hi,

Jetziger Stand meiner Arbeit:

echo("...

Zum x-ten Mal - niemanden interessiert serverseitiger Code, wenn es um ein clientseitiges Problem geht!
Zeige den Code, den der Client erhält.

Ziel ist es aber, dass jedes Mal wenn der Text angeklickt wird, sich die Checkbox verändert. Ist das möglich?

Wenn du nur jeweils zwischen angekreuzt und nicht wechseln willst - dann weise einfach die Negation des aktuellen Wertes zu.

MfG ChrisB

[fastix®]

Moin!

Wenn du nur jeweils zwischen angekreuzt und nicht wechseln willst - dann weise einfach die Negation des aktuellen Wertes zu.

Chris meint:

<input name="check0815" id="check0815" type="checkbox" value="x"><span oncklick="toggleChecked('check0815')">Variante mit Eventhandler</span>  
  
<input name="check0816" id="check0816" type="checkbox" value="x"><a href="javascript:toggleChecked('check0816')">Variante mit Funktion als Zielverweis</a>

<script type="text/javascript">  
function toggleChecked(elementId) {  
   var obj=document.getElementById(elementId);  
   if (obj.checked) {  
       obj.checked=false;  
   } else {  
       obj.checked=true;  
   }  
   return true;  
}  
</script>

Die Funktion stellt fest, ob das Element "angekreuzt" ist. Wenn ja wird "das Kreuz entfernt", sonst gesetzt.

Alternative Notation:

<script type="text/javascript">  
function toggleChecked(elementId) {  
   var obj=document.getElementById(elementId);  
   obj.checked=(! obj.checked); // immer Negation: Setze die Eigenschaft "checked" auf den Wert, den diese gerade nicht hat  
   return true;  
}  
</script>

http://de.selfhtml.org/javascript/objekte/elements.htm#checked@title=Literatur

Die eigentliche Checkbox darf NICHT Bestandteil des Links oder des Bereiches mit dem Eventhandler "onclick" sein, sonst ist das Ergebnis nicht das erwartete.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[sailing]

Ein verspätetes Dankeschön an fastix,
das war genau das, was ich gesucht habe!

DANKE!

mfg
sailing

[EKKi]

Mahlzeit fastix®,

<input name="check0816" id="check0816" type="checkbox" value="x"><a href="javascript:toggleChecked('check0816')">Variante mit Funktion als Zielverweis</a>[/code]

Diese Variante ist Blödsinn: siehe Zitat 2002!

MfG,
EKKi

[fastix®]

Moin!

<input name="check0816" id="check0816" type="checkbox" value="x"><a href="javascript:toggleChecked('check0816')">Variante mit Funktion als Zielverweis</a>

Diese Variante ist Blödsinn: siehe Zitat 2002!

Ach? Zitat 2002 ist ein Bewertungsmaßstab?

Dort, wo das Zitierte geäußert wurde ging es um:
<a href="#" onclick="return show_status_cmnt(2, '2a')" id="2a"> Kommentar posten </a>
und das ist etwas ganz anderes: nämlich "falsch", weil nach dem onclick in vielen Fällen ein wahrer Wert zurückgegeben wird, worauf hin der Browser versucht zur leeren Zielmarke, also nach ganz oben zu springen.

Guckst Du auch hier im Quelltext nach.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[Kai345]

[latex]Mae  govannen![/latex]

<input name="check0816" id="check0816" type="checkbox" value="x"><a href="javascript:toggleChecked('check0816')">Variante mit Funktion als Zielverweis</a>

Diese Variante ist Blödsinn: siehe Zitat 2002!

Ach? Zitat 2002 ist ein Bewertungsmaßstab?

Dort, wo das Zitierte geäußert wurde ging es um:

...Links, die nicht (auf eine Ressource) verlinken. Und das ist in obigem Beispiel der Fall. Fazit: Zitat passt.

Cü,

Kai

[fastix®]

Moin!

...Links, die nicht (auf eine Ressource) verlinken. Und das ist in obigem Beispiel der Fall. Fazit: Zitat passt.

Quatsch. Passt erweislich nicht. Es wird auf ein eine Ressource mit dem Pseudoprotokoll Javascript verlinkt. Der Rest steht hier und sogar in http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#a@title=SELFTHML.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[Kai345]

[latex]Mae  govannen![/latex]

...Links, die nicht (auf eine Ressource) verlinken. Und das ist in obigem Beispiel der Fall. Fazit: Zitat passt.

Quatsch. Passt erweislich nicht. Es wird auf ein eine Ressource mit dem Pseudoprotokoll Javascript verlinkt. Der Rest steht hier und sogar in http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#a@title=SELFTHML.

SelfHTML ist alt. Das onclick-Attribut bzw. unobstrusive JS existieren. Es wird höchste Zeit, daß solch veralteter Unsinn wie in dem verlinkten Beispiel entfernt und insbesondere _hier_ nicht weiter verbreitet wird.

Schalte JS aus. Klicke auf das Ding, das du Link nennst. Es geschieht nichts.
Ein Link, der nicht verlinkt... usw  Ergo: Es ist _kein_ Link. Zitat passt.

Cü,

Kai

[fastix®]

Moin!

SelfHTML ist alt. Das onclick-Attribut bzw. unobstrusive JS existieren. Es wird höchste Zeit, daß solch veralteter Unsinn wie in dem verlinkten Beispiel entfernt und insbesondere _hier_ nicht weiter verbreitet wird.

Das sehe ich ganz anders. Das, was (nicht nur) Du "veralteter" Unsinn nennst sehe (nicht nur) ich als weniger kompliziert und undurchsichtig an als das unobstrusive JS. Ich bin der Auffassung, dass kleine und einfache Dinge auch klein und einfach bleiben sollten. Nenne es meinetwegen Pragmatismus.

Schalte JS aus. Klicke auf das Ding, das du Link nennst.

Ja. Und? Ich kann, wenn ich will, den Link auch mit Javascript setzen. Wo ist das Problem?

Schalte JS aus.

Dann geht auch das unobtrusive_JavaScript nicht mehr. Das damit unter ungleich größerem Aufwand  "anklickbar" gemachte klickt man dann auch vergebens an. Wo _genau_ ist der Vorteil? In der schönen streng eingehaltenen Theorie? Was kostet der Mehraufwand für diese schöne Strenge beim Entwickeln? Stimmt: In der Theorie interessiert das nicht.

Wenn Du schon meckerst, dann biete doch Deine Lösung an. Das genau wäre "fachlich hilfreich".

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[Kai345]

[latex]Mae  govannen![/latex]

SelfHTML ist alt. Das onclick-Attribut bzw. unobstrusive JS existieren. Es wird höchste Zeit, daß solch veralteter Unsinn wie in dem verlinkten Beispiel entfernt und insbesondere _hier_ nicht weiter verbreitet wird.

Das sehe ich ganz anders. Das, was (nicht nur) Du "veralteter" Unsinn nennst sehe (nicht nur) ich als weniger kompliziert und undurchsichtig an als das unobstrusive JS. Ich bin der Auffassung, dass kleine und einfache Dinge auch klein und einfach bleiben sollten. Nenne es meinetwegen Pragmatismus.

Dann eben als das von mir ebenfalls erwähnte onclick-Attribut. Damit erspart man sich den zusätzlichen Aufwand von unobJS. Damit habe ich kein Problem, auch wenn ich persönlich die "unob"-Variante immer bevorzugen würde. Aber href="javascript:..." halte ich eigentlich immer für die falsche Methode. Mir fällt jedenfalls kein Anwendungsfall ein, in dem ich es statt onclick nutzen möchte.

Schalte JS aus. Klicke auf das Ding, das du Link nennst.
Ja. Und? Ich kann, wenn ich will, den Link auch mit Javascript setzen. Wo ist das Problem?

*Dann* ist es keines. Steht es im HTML, ist es eines. (Wenn man davon absieht, daß ich es immer noch nicht als Link bezeichnen würde, aber darum geht es mir nicht).

Schalte JS aus.
Dann geht auch das unobtrusive_JavaScript nicht mehr. Das damit unter ungleich größerem Aufwand  "anklickbar" gemachte klickt man dann auch vergebens an. Wo _genau_ ist der Vorteil? In der schönen streng eingehaltenen Theorie? Was kostet der Mehraufwand für diese schöne Strenge beim Entwickeln? Stimmt: In der Theorie interessiert das nicht.

Wenn Du schon meckerst, dann biete doch Deine Lösung an. Das genau wäre "fachlich hilfreich".

Ach Gott, die alte "machs doch besser" Masche. Wenn der Maurer in meinem Haus eine schiefe/wackelige Mauer hochzieht, muß ich es auch selber nicht besser machen können, um mich darüber beschweren zu dürfen. Zumal ich mit der Erwähnung von »onclick« und »unobstrusive JS« bereits die besseren Alternativen genannt habe.

Cü,

Kai

[dedlfix]

Hi!

<input name="check0816" id="check0816" type="checkbox" value="x"><a href="javascript:toggleChecked('check0816')">Variante mit Funktion als Zielverweis</a>
Diese Variante ist Blödsinn: siehe Zitat 2002!
Ach? Zitat 2002 ist ein Bewertungsmaßstab?

Natürlich ist das kein Zitat einer RFC, aber es trifft den Kern des Problems.

Dort, wo das Zitierte geäußert wurde ging es um:
<a href="#" onclick="return show_status_cmnt(2, '2a')" id="2a"> Kommentar posten </a>
und das ist etwas ganz anderes: nämlich "falsch", weil nach dem onclick in vielen Fällen ein wahrer Wert zurückgegeben wird, worauf hin der Browser versucht zur leeren Zielmarke, also nach ganz oben zu springen.

Deine Variante unterdrückt das Wegspringen aber auch nicht. Und der Browser springt nicht nur nach oben sondern zu einer neuen Seite, die "true" ausgibt. Mit einem Eventhandler auf einem nicht linkenden Element (wie span) hat man solche Probleme grundsätzlich nicht. In diesem Fall ist jedoch der Einsatz einer Javascript-Lösung komplett unnötig, denn wie bereits 10 Stunden vor deiner Antwort richtig bemerkt wurde gibt es das HTML-Element label, das die gewünschte Funktionalität schon von Haus aus mitbringt.

Lo!

[fastix®]

Moin!

Deine Variante unterdrückt das Wegspringen aber auch nicht. Und der Browser springt nicht nur nach oben sondern zu einer neuen Seite, die "true" ausgibt.

Das wird behoben indem die aufgerufene Funktion einfach keinen return zurück gibt und hat mit dem Pseudoprotokoll "javascript:" insoweit nicht unbedingt zu tun.

Alternativ kann man auch <a href="javascript:dummy=meineFunktion('wert')"> aufrufen.

Siehe auch: http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#a@title=http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#a

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[fastix®]

Moin!

Dann teste doch mal:

<html>  
	<head>  
		<title>Javascript als Zielverweis</title>  
		<script type="text/javascript">  
		function toggleChecked(elementId) {  
			var obj=document.getElementById(elementId);  
			if (obj.checked) {  
				obj.checked=false;  
			} else {  
				obj.checked=true;  
			}  
		}  
		</script>  
	</head>  
	<body>  
		<form name="test" method="GET" action="?">  
			<input name="check0815" id="check0815" type="checkbox" value="x"><a href="javascript:toggleChecked('check0815')">Klicke hier</a><br /><br />  
			<input name="check0816" id="check0816" type="checkbox" value="x"><a href="javascript:dummy=toggleChecked('check0816')">oder hier</a><br /><br />  
			<input type="submit">  
		</form>  
	</body>  
</html>

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[dedlfix]

Hi!

Dann teste doch mal:

Jetzt ist die Funktionalität in Ordnung. (Trotzdem bleibt es wegen der Existenz und Nutzbarkeit von label unnötig.)

Lo!

[Tobias Hahner]

Hallihallo!

Muss es unbedingt Javascript sein?
Ich nutze für genau diesen Zweck immer das Element label.
In Fällen, wo ich den Zustand der Checkbox direkt abgreifen will/muss, nutze ich den Eventhandler onchange für das jeweilige Formularelement.

Beste Grüsse,
    Tobias Hahner