nicht angemeldet
Radiobuttons nach enablen wieder disablen
0 0 0 0 
Der Martin
0
1 Der Martin
Radiobuttons nach enablen wieder disablen
Hallo,
Ich habe schon Stunden in verschiedenen Foren versucht etwas über das disablen und enablen von Radiobuttons bzw. Checkboxen herauszufinden. Ohne Erfolg.
Ich habe folgendes Problem.
Ich möchte ein Formular erstellen, in dem nach anklicken einer Checkbox 3 weitere Radiobuttons "aktiviert" werden. Das ist mir auch schon geglückt. Jedoch wenn ich die Checkbox wieder demakiere(gibt es das Wort?) werden die Radiobuttons nicht wieder disabled.
Hier mein Versuch:
<html>
<head>
<title>Click-Test</title>
<script language="javascript">
function Bildformat_ein()
{document.Form1.Bildformat.disabled = false;
document.Form1.Bildformat2.disabled = false;
document.Form1.Bildformat3.disabled = false; }
function Bildformat_aus()
{document.Form1.Bildformat.disabled = true;
document.Form1.Bildformat2.disabled = true;
document.Form1.Bildformat3.disabled = true; }
function FP_changePropRestore() {//v1.0
var d=document,x; if(d.$cpe) { for(i=0; i<d.$cpe.length; i++) { x=d.$cpe[i];
if(x.v=="") x.v=""; eval("x."+x.n+"=x.v"); } d.$cpe=null; }
}
</script>
</head>
<body>
<form id="Form1" name="Form1" method="post">
<input id="CD" type="checkbox" name="CD" value="ja"> CD
<input id="Entwickelt" type="checkbox" name="Entwickelt" value="ja" onchange="Bildformat_ein()"> Entwickelt<p/>
<input id="Bildformat" type="radio" name="Box" disabled>1
<input id="Bildformat2" type="radio" name="Box" disabled>2
<input id="Bildformat3" type="radio" name="Box" disabled>3
</form>
</body>
</html>
Also wie gesagt das enablen funktioniert prächtig, jedoch werden bei Demakierung der Checkbox 'Entwickelt' die Radiobuttons nicht wieder disabled.
Mir ist ja auch klar warum. Ich kann ja den Befehl 'Bildformat_aus' nirgends unterbringen, da es mir kein Event-Handler wie z.B. onclick bekannt ist, der die Auswahl einer Checkbox beschreibt.
Ergänzend ist noch zu sagen, das natürlich beide Checkboxen auswählbar sein sollen oder auch nicht. Deshalb kann ich den Befehl'Bildformat_aus' auch nicht bei der Checkbox 'CD' unterbringen.
Ich hoffe es kann mir jemand helfen. Bitte scheißt mich nicht wegen irgendwelchen falschen Ausdrücken zusammen(hab ich hier schon öfters gesehen), sondern weißt mich darauf hin. Bin noch nicht sehr lange beim dabei und kenne mich daher noch nicht so gut wie die meisten anderen hier aus.
Gens
-
<input id="Entwickelt" type="checkbox" name="Entwickelt" value="ja" onchange="Bildformat_ein()"> Entwickelt<p/>
Wenn ich das richtig sehe, dann rufst du auch immer nur eine Function auf, nämlich die zum aktivieren der Radios. Am besten du fragst in dieser Funktion ab, ob aktiviert oder deaktiviert werden soll.
Heizer
-
Wenn ich das richtig sehe, dann rufst du auch immer nur eine Function auf, nämlich die zum aktivieren der Radios. Am besten du fragst in dieser Funktion ab, ob aktiviert oder deaktiviert werden soll.
Danke an alle für eure Hilfe! Ich bin grad dabei, das mit dem Abfragen einzubauen. Also nur Geduld;)
Max
-
So,
bin mal gespannt ob euch das zufriedenstellt oder ob es noch was zu bemängeln gibt.(ich habe natürlich jeder Zeit ein offenes Ohr für Verbesserungsvorschläge).Hier der Code:
<html><head>
<title>Test</title>
<script type="text/javascript">
function test () {
if (document.Testform.ArtundWeise[1].checked == true) {
var deaktiviert = false;
} else {
var deaktiviert = true;
}
for (var i = 0; i < document.Testform.Format.length; i++) {
document.Testform.Format[i].disabled = deaktiviert;
}
}
</script>
</head>
<body><form action="" name="Testform">
<p>Wie möchten Sie die Fotos erhalten?</p>
<p><input type="checkbox" name="ArtundWeise" value="CD" onclick="test();"> CD<br>
<input type="checkbox" name="ArtundWeise" value="Entwickelt" onclick="test();"> Entwickelt</p>
<p>In welchem Format?</p>
<p><input type="radio" name="Format" value="9x13" disabled> 9x13<br>
<input type="radio" name="Format" value="10x15" disabled> 10x15<br>
<input type="radio" name="Format" value="13x18" disabled> 13x18<br>
</form></body>
</html>
So nun muss ich das noch in meine Seite einbinden.
Max
-
Hallo zu später Stunde,
bin mal gespannt ob euch das zufriedenstellt
wieso denn das? Es muss _dich_ und die Besucher deiner Seite zufriedenstellen. Wir können höchstens blöde Kommentare oder auch Verbesserungsvorschläge bringen - ob du darauf eingehen magst, bleibt dir überlassen. ;-)
<script type="text/javascript">
function test () {
if (document.Testform.ArtundWeise[1].checked == true) {Das ist etwas unbeholfen: "Stimmt es, dass es wahr ist, dass..."
Der explizite Vergleich auf ==true ist hier nicht nur unnötig, sondern macht es IMHO auch schlechter lesbar, denn die Eigenschaft checked eines Radiobuttons oder einer Checkbox gibt ja schon einen boolschen Wert:if (document.Testform.ArtundWeise[1].checked) {
Und zusammen mit den nachfolgenden Zeilen kann man das noch elegant zusammenfassen und die if-Anweisung einsparen:
var deaktiviert = !(document.Testform.ArtundWeise[1].checked);
<form action="" name="Testform">
Möchtest du wirklich keine Aktion mit dem Formular ausführen (ich finde auch keinen Submit-Button), oder hast du das action-Attribut hier nur weggelassen, weil es für die aktuelle Frage nicht wichtig ist?
<p><input type="radio" name="Format" value="9x13" disabled> 9x13<br>
<input type="radio" name="Format" value="10x15" disabled> 10x15<br>
<input type="radio" name="Format" value="13x18" disabled> 13x18<br>Hier fehlt noch ein abschließendes </p>, aber sonst sieht's schon sehr gut aus. Die Vorschläge, die ich weiter oben geäußert habe, sind wirklich nur Optimierung oder "Kosmetik" und haben keine Auswirkungen auf die Funktion.
Gute Nacht auch,
Martin
-
Hallo Martin,
<script type="text/javascript">
function test () {
if (document.Testform.ArtundWeise[1].checked == true) {Das ist etwas unbeholfen: "Stimmt es, dass es wahr ist, dass..."
Der explizite Vergleich auf ==true ist hier nicht nur unnötig, sondern macht es IMHO auch schlechter lesbar, denn die Eigenschaft checked eines Radiobuttons oder einer Checkbox gibt ja schon einen boolschen Wert:if (document.Testform.ArtundWeise[1].checked) {
Und zusammen mit den nachfolgenden Zeilen kann man das noch elegant zusammenfassen und die if-Anweisung einsparen:
var deaktiviert = !(document.Testform.ArtundWeise[1].checked);
Ich bin wirklich schon glücklich, dass das ganze überhaupt funktioniert. Aber die Kosmetik, kann ich ja mal zu anderer Stunde einfügen.
<form action="" name="Testform">
Möchtest du wirklich keine Aktion mit dem Formular ausführen (ich finde auch keinen Submit-Button), oder hast du das action-Attribut hier nur weggelassen, weil es für die aktuelle Frage nicht wichtig ist?
Ich habe das ganze so einfach als möglich gehalten und nicht direkt in meiner Seite eingebaut. Deswegen sind dort Lücken, die natürlich auf der richtigen Seite ausgefüllt sind.
<p><input type="radio" name="Format" value="9x13" disabled> 9x13<br>
<input type="radio" name="Format" value="10x15" disabled> 10x15<br>
<input type="radio" name="Format" value="13x18" disabled> 13x18<br>Hier fehlt noch ein abschließendes </p>, aber sonst sieht's schon sehr gut aus.
Das mit dem </p> ändere ich sofort.
»»Die Vorschläge, die ich weiter oben geäußert habe, sind wirklich nur Optimierung oder "Kosmetik" und haben keine Auswirkungen auf die Funktion.Gute Nacht auch,
Martin
Nochmals vielen, vielen Dank für die Hilfe. Vielleicht werde ich sie irgendwann einmal wieder in Anspruch nehemen (müssen).
Guten Nacht
Max
-
-
Hallo,
Da mich die Aufgabenstellung selbst interessiert hat, habe ich auch ein wenig an deinem Script herumgebastelt. Dabei ist mir aufgefallen, dass dein Script ein ein paar Schwächen hat, die nicht gleich ins Auge springen. 1) Wenn man CD und Entwickelt wählt, dann wird beim Absenden nur der Wert Entwickelt mitgeschickt. 2) Wenn man erst eines der Formate ausgewählt hat und sich dann doch umentschieden hat und kein Entwickelt zu bestellen (man also beide Checkbox deaktiviert) dann wird dennoch das Format beim Absenden mitgeschickt. 3) Wenn man es mit der Tastatur bedient dann funktioniert es unter Umständen nicht. Außerdem wollte ich das gekapselt haben, so dass mehrere Formulare auf der gleichen Seite das Script gleichzeitig nutzen können, es also unabhängig vom Namen das Formulars ist. Das ist hierbei herausgekommen:
<html> <head> <title>Formular Test</title> <script type="text/javascript"> [code lang=javascript] function formate(tag) { while(tag.nodeName != 'FORM') tag = tag.parentNode; if(tag.Entwickelt.checked) var deaktiviert = false; else var deaktiviert = true; for (var i=0; i < tag.Format.length; i++) { tag.Format[i].disabled = deaktiviert; if(deaktiviert) tag.Format[i].checked = false; } }</script>
</head>
<body>
<form action="" name="Testform">
<fieldset>
<legend>Wie möchten Sie die Fotos erhalten?</legend>
<p>
<label><input type="checkbox" name="CD" value="true"> CD</label>
<label><input type="checkbox" name="Entwickelt" value="true" onchange="formate(this);"> Entwickelt</label>
</p>
<p>
In welchem Format?
<label><input type="radio" name="Format" value="9x13" disabled> 9x13</label>
<label><input type="radio" name="Format" value="10x15" disabled> 10x15</label>
<label><input type="radio" name="Format" value="13x18" disabled> 13x18</label>
</p>
</fieldset>
</form>
</body>
</html>[/code]Grüße
Jeena Paradies-
Hallo
<html>
<head>
<title>Formular Test</title>
<script type="text/javascript">
[code lang=javascript] function formate(tag) {while(tag.nodeName != 'FORM') tag = tag.parentNode;
if(tag.Entwickelt.checked) var deaktiviert = false;
else var deaktiviert = true;for (var i=0; i < tag.Format.length; i++) {
tag.Format[i].disabled = deaktiviert;
if(deaktiviert) tag.Format[i].checked = false;
}
}> </script> > </head> Also wenn ich das hier richtig verstanden habe, bewirkt das letzte hier, dass beim unckecken der Checkbox 'Entwickelt' die Auswahl der Radiobuttons gelöscht wird. Das war ja bei meinem Script nicht der Fall und somit würde der Wert dann weitergegeben obwohl es deaktiviert war.Es hat auch ein wenig gestört, aber das hier ist mir einfach noch ne Nummer zu hoch als Anfänger. > <body> > <form action="" name="Testform"> > <fieldset> > <legend>Wie möchten Sie die Fotos erhalten?</legend> > <p> > <label><input type="checkbox" name="CD" value="true"> CD</label> > <label><input type="checkbox" name="Entwickelt" value="true" onchange="formate(this);"> Entwickelt</label> > </p> > <p> > In welchem Format? > <label><input type="radio" name="Format" value="9x13" disabled> 9x13</label> > <label><input type="radio" name="Format" value="10x15" disabled> 10x15</label> > <label><input type="radio" name="Format" value="13x18" disabled> 13x18</label> > </p> > </fieldset> > </form> > </body> > </html>[/code] Das mit dem <fieldset></fieldset> und dazwischen mit den Labels(ich hab mal gelesen, das nur Netscape <label> verarbeitet, stimmt das oder ist das völliger Stuss?) dient nur zur grafischen Aufwertung(oder?) Bei mir ist das ganze in eine Tabelle eingebaut. Also das hier, denke ich, ist wirklich nicht mehr zu topen. Vielen herzlichen Dank Max-
@ Jeena Paradies
Eine kleine Bemerkung am Rande:Ich war gerade auf deiner Homepage und mir ist aufgefallen, dass man so ein schönes abgewogenes Design nur selten zu Sehen bekommt. Noch viel Erfolg mit deiner Weblogsoftware " Jlog — Weblogsoftware ".
Gruß nach Schweden
Max -
Hallo,
if(deaktiviert) tag.Format[i].checked = false;
Also wenn ich das hier richtig verstanden habe, bewirkt das letzte hier, dass beim unckecken der Checkbox 'Entwickelt' die Auswahl der Radiobuttons gelöscht wird.Ja genau.
aber das hier ist mir einfach noch ne Nummer zu hoch als Anfänger.
Wenn ich irgendwie zum Verständniss beitragen kann mache ich das gerne, du kannst einfach fragen..
Das mit dem <fieldset></fieldset> und dazwischen mit den Labels(ich hab mal gelesen, das nur Netscape <label> verarbeitet, stimmt das oder ist das völliger Stuss?) dient nur zur grafischen Aufwertung(oder?) Bei mir ist das ganze in eine Tabelle eingebaut.
Also als erstes mal ist es dazu da, dass es egal ist ob man genau die Checkbox oder das Radiobutton trifft, oder nur den Text daneben, in beiden Fällen wird aktiviert. Das mit dem Netscape stimmt so nicht. Alle moderneren Browser -- außer der IE -- verarbeiten das genau so. Der IE kann (noch) nicht damit umgehen dass man durch die Verschachtelung <label><input></label> ein label zu einem input zuweist. Für den müsste man es mit einer ID machen: <input id="foo"> <label for="foo">meine Erklärung</label> dann klappt das auch bei dem. Mit <fieldset> können alle modernen Browser umgehen, am leichtesten herausfinden lässt sich das indem man sich die Icons und die Versionsnummern bei diesem Tag in SELFHTML anschaut: http://de.selfhtml.org/html/formulare/strukturieren.htm#gruppieren
Das zweite ist die Semantik, <fieldset> und <label> sind genau dazu gedacht ein Formular mit Informationen anzureichern und auch Angrifspunkte für dein CSS zu bieten um es zu formatieren. Dann kann man meist auf alle Tabellen und <br> Konstrukte verzichten. Beide Sachen kommen der "Barierefreicheit" im Netz zugute.
Also das hier, denke ich, ist wirklich nicht mehr zu topen.
Da irrst du glaube ich, meiner Erfahrung nach kann man fast jedes Script irgendwie noch eleganter lösen und noch preformanter, auch wenn man jetzt gerade noch nicht weiß wie ;-).
Grüße
Jeena Paradies
-
-
-
-
-
-
Hallo,
Ich habe schon Stunden in verschiedenen Foren versucht etwas über das disablen und enablen von Radiobuttons bzw. Checkboxen herauszufinden. Ohne Erfolg.
Nanu - das schockiert mich jetzt aber!
Ich möchte ein Formular erstellen, in dem nach anklicken einer Checkbox 3 weitere Radiobuttons "aktiviert" werden. Das ist mir auch schon geglückt. Jedoch wenn ich die Checkbox wieder demakiere(gibt es das Wort?) werden die Radiobuttons nicht wieder disabled.
Klar. Du gehst ja auch bei jedem Anklicken davon aus, dass die Checkbox markiert wurde.
function Bildformat_ein()
{document.Form1.Bildformat.disabled = false;
document.Form1.Bildformat2.disabled = false;
document.Form1.Bildformat3.disabled = false; }function Bildformat_aus()
{document.Form1.Bildformat.disabled = true;
document.Form1.Bildformat2.disabled = true;
document.Form1.Bildformat3.disabled = true; }Also die Voraussetzungen sind schon da. :-)
function FP_changePropRestore() {//v1.0
Wozu das? Die Funktion wird -zumindest in dem hier gezeigten Codeausschnitt- gar nicht aufgerufen.
<input id="Entwickelt" type="checkbox" name="Entwickelt" value="ja" onchange="Bildformat_ein()"> Entwickelt<p/>
Also: Bei jedem Zustandswechsel rufst du hier einfach Bildformat_ein() auf, ohne nachzufragen, ob die Checkbox jetzt an- oder abgewählt worden ist (Nebenbei: Was soll das </p>, das einen Absatz beendet, der nirgends angefangen hat?) Du solltest also im onchange-Eventhandler zuerst den aktuellen Zustand der Checkbox abfragen und dann abhängig davon entweder Bildformat_ein() oder Bildformat_aus() aufrufen.
Mir ist ja auch klar warum. Ich kann ja den Befehl 'Bildformat_aus' nirgends unterbringen, da es mir kein Event-Handler wie z.B. onclick bekannt ist, der die Auswahl einer Checkbox beschreibt.
Na also, das Problem hast du schon erkannt. Mit dem obigen Hinweis kannst du nun eine Fallunterscheidung konstruieren.
Schönen Abend noch,
Martin
--
Auf jeden Menschen auf der ganzen Welt entfallen statistisch gesehen etwa 3000 Spinnen, wie Wissenschaftler jetzt festgestellt haben.
Wer will meine haben? Denn ich will sie bstimmt nicht.
Schon Urlaubspläne für 2006?-
Hallo Martin,
Danke für di Hilfe! Hab das ganze aus meiner Seite kopiert und dann aus Versehen ist mit das </p> mit reingerutsch.
Bin zuversichtlich, dass ich das ganze ändern kann
Max
-