SelectBox: disable enable via Checkbox
Sebastian Bauer
- html
Moin,
Wie kann ich z.B. die Select-Box disabled darstellen, wenn die Checkbox nicht gecheckt ist?
<input type="checkbox"onclick="endisable()"id="act1" name="act1" style="background:none;"/>active
<br />
<select class="form-txtf3"id="sel1" name="sel1">
<option value="0">Broadcast</option>
<option selected="selected" value="1">Unicast</option>
</select>
onclick="endisable()" ist eine Javascript Funktion, die die Selectbox disabled oder enabled -> allerings ja erst wenn der User einen OnClick() auf die Checkbox ausgelöst hat.
Ich möchte gern zu Beginn, wenn der User die Seite anfordert in Abhängigkeit der Checkbox (gechecked oder nicht) die SelectBox auswählbar haben oder nicht...
Gruß
Sebastian
Moin!
Ich möchte gern zu Beginn, wenn der User die Seite anfordert in Abhängigkeit der Checkbox (gechecked oder nicht) die SelectBox auswählbar haben oder nicht...
Aeh. Und dein Problem dabei ist welches? Du wirst ja wohl default Einstellungen haben, oder wird das HTML durch ein Script generiert? Dann muss eben dieses Script das HTML entsprechend genereiren.
mal ne andere Frage.
Kann man dieses Textfeld, welches je nach State der Checkbox en- bzw. disabled werden soll, auch ohne Javascript sondern mit PHP oder ähnlichem ausführen?
Gruß
Sebastian
Tach auch.
Kann man dieses Textfeld, welches je nach State der Checkbox en- bzw. disabled werden soll, auch ohne Javascript sondern mit PHP oder ähnlichem ausführen?
Wenn ich deine Frage richtig verstehe (kleiner Tipp: einmal Korrekturlesen, damit der Sinn wenigstens erkennbar wird!):
Du setzt das Attribut 'disabled' des Textfelds auf einen korrekten Wert (etwa 'disabled').
Bis die Tage,
Matti
Hi,
<input type="checkbox" onclick="codename()" id="act1" name="checkname" style="background:none;" />
<input type="text" disabled size="10" name="textname">
Ist das valider XHTML Code? Hab auf dieser Webpage das Example gefunden. Wenn Javascript enabled ist, kann dann durch einen OnClick() auf die Checkbox das Inputfeld disabled oder enabled werden.
http://www.htmlgoodies.com/tutorials/forms/article.php/3479101/Triminds---Enable-and-Disable.htm
<script type="text/javascript">
function codename() {
if (document.myform.act1.checked) {
document.myform.duni1.disabled = false;
document.myform.sel1.disabled = false;
document.myform.d1node1.disabled = false;
document.myform.d1node2.disabled = false;
document.myform.d1node3.disabled = false;
document.myform.d1node4.disabled = false;
}
else {
document.myform.duni1.disabled = true;
document.myform.sel1.disabled = true;
document.myform.d1node1.disabled = true;
document.myform.d1node2.disabled = true;
document.myform.d1node3.disabled = true;
document.myform.d1node4.disabled = true;
}
};
</script>
Mit meiner letzten Frage meinte ich, ob man dieses Javascript auch mittels PHP etc. realisieren kann?
Zwischen jedem Attribute in einem Inputfield muss mindestens ein Leerzeichen vorhanden sein, damit es valider Code ist?
Gruß
Sebastian
Hallo,
<input type="checkbox" onclick="codename()" id="act1" name="checkname" style="background:none;" />
<input type="text" disabled size="10" name="textname">
> Ist das valider XHTML Code?
das erste ja, das zweite nicht. Leere Elemente müssen in XHTML mit der Kurzschreibweise "/>" geschlossen werden, und Attribute ohne Wert sind nicht erlaubt.
> Hab auf dieser Webpage das Example gefunden.
Welche "diese"?
> Wenn Javascript enabled ist, kann dann durch einen OnClick() auf die Checkbox das Inputfeld disabled oder enabled werden.
Und was hätte das mit (X)HTML zu tun?
> Mit meiner letzten Frage meinte ich, ob man dieses Javascript auch mittels PHP etc. realisieren kann?
Hä? Das Aktivieren bzw. Deaktivieren von Formularfeldern? Nein.
Das ist eine clientseitige Angelegenheit, PHP läuft aber auf dem Server.
> Zwischen jedem Attribute in einem Inputfield muss mindestens ein Leerzeichen vorhanden sein, damit es valider Code ist?
Ein Whitespace-Zeichen. Das kann ein Leerzeichen, ein Tab, ein Zeilenumbruch sein.
Ciao,
Martin
--
Lieber eine Stumme im Bett, als eine Taube auf dem Dach.
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
Hallo,
<input type="checkbox" onclick="codename()" id="act1" name="checkname" style="background:none;" />
<input type="text" disabled size="10" name="textname">
>
> > Ist das valider XHTML Code?
>
> das erste ja, das zweite nicht. Leere Elemente müssen in XHTML mit der Kurzschreibweise "/>" geschlossen werden, und Attribute ohne Wert sind nicht erlaubt.
>
> > Hab auf dieser Webpage das Example gefunden.
>
> Welche "diese"?
>
dachte ich hätte sie reinkopiert:
[Enable / Disable ](http://www.htmlgoodies.com/tutorials/forms/article.php/3479101/Triminds---Enable-and-Disable.htm)
> > Wenn Javascript enabled ist, kann dann durch einen OnClick() auf die Checkbox das Inputfeld disabled oder enabled werden.
>
> Und was hätte das mit (X)HTML zu tun?
`<input type="text" size="10" name="textname" />`{:.language-html}
Das Problem ist, wenn die Felder alle enabled sind, also disabled="disabled" nicht vorhanden ist, kann ich mit der Javascript-Funktion (OnClick()-Handler) diese Felder auch nicht deaktivieren....
Welche Möglichkeiten stehen mir dann zur Verfügung? Auf HTML Seite wenn ich das richtig sehe, gar keine. Und auf Javascript-Seite? Ich möchte halt jetzt per Javascript die Input-Box von oben disablen können...
Gruß´
Sebastian
Hi,
Hab auf dieser Webpage das Example gefunden.
Welche "diese"?
dachte ich hätte sie reinkopiert:
Enable / Disable
ja, hattest du - aber nicht verlinkt, ohne weiteren Kommentar und zwei oder drei Zeilen weiter unten, so dass ich keinen Zusammenhang erkennen konnte.
<input type="text" size="10" name="textname" />
Das Problem ist, wenn die Felder alle enabled sind, also disabled="disabled" nicht vorhanden ist, kann ich mit der Javascript-Funktion (OnClick()-Handler) diese Felder auch nicht deaktivieren....
Warum nicht? Die Eigenschaft disabled auf true zu setzen ist doch jederzeit möglich. Ich sehe dein Problem nicht ...
Ciao,
Martin
Hi,
Hab auf dieser Webpage das Example gefunden.
Welche "diese"?
dachte ich hätte sie reinkopiert:
Enable / Disableja, hattest du - aber nicht verlinkt, ohne weiteren Kommentar und zwei oder drei Zeilen weiter unten, so dass ich keinen Zusammenhang erkennen konnte.
<input type="text" size="10" name="textname" />
Das Problem ist, wenn die Felder alle enabled sind, also disabled="disabled" nicht vorhanden ist, kann ich mit der Javascript-Funktion (OnClick()-Handler) diese Felder auch nicht deaktivieren....Warum nicht? Die Eigenschaft disabled auf true zu setzen ist doch jederzeit möglich. Ich sehe dein Problem nicht ...
ok, d.h. disabled="true" oder disabled="false" kann gesetzt werden. Dann gibts echt kein Problem; bin nicht so fit in html, und Dreamweaver bietet mir hier nicht die Auswahl von true und false an, sondern lediglich von disabled="disabled"
Hier mal mein Doctype, vielleicht liegt es auch an diesem oder Dreamweaver kann es einfach nicht...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
Gruß
Sebastian
@@Sebastian Bauer:
nuqneH
ok, d.h. disabled="true" oder disabled="false" kann gesetzt werden.
Nein. Du musst zwischen HTML-Attributwerten und Werten von Eigenschaften in JavaScript unterscheiden. Oft stimmt beides überein; hier aber nicht.
In HTML notierst du @disabled ohne Wert <input disabled>
oder mit dem festen Wert "disabled" <input disabled="disabled">
. Andere Werte sind für das @disabled-Attribut nicht erlaubt. In XHTML gibt es nur die Variante mit Attributwert (und mit Slash) <input disabled="disabled"/>
(<http://de.selfhtml.org/html/xhtml/unterschiede.htm@title=Unterschiede zwischen XHTML und HTML>).
In JavaScript setzt du den Wert der disabled
-Eigenschaft auf true
bzw. false
(ohne Anführungszeichen!).
Dreamweaver bietet mir hier nicht die Auswahl von true und false an, sondern lediglich von disabled="disabled"
Es sollte jetzt verständlich sein, warum.
Qapla'
scheinbar stelle ich mich etwas zu dumm an, aber es funktioniert immer noch nicht...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>switchTextareaAbility</title>
</head>
<body>
<form name="one" action="">
<input type="checkbox" checked="checked">
<textarea name="two" disabled>Text1</textarea>
<textarea name="three" disabled="disabled">Text2</textarea>
</form>
</body>
</html>
Beide Textfelder werden disabled dargstellt im IE; obwohl einmal disabled und einmal disabled="disabled" verwendet wurde...
Gruß
Sebastian
Mahlzeit Sebastian Bauer,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Beide Textfelder werden disabled dargstellt im IE; obwohl einmal disabled und einmal disabled="disabled" verwendet wurde...
Selbstverständlich - Du benutzt ja auch einen (unvollständigen) HTML-4.01-Dokumenttyp. Darüber hinaus hast Du ganz offensichtlich die von Gunnar freundlicherweise verlinkten Informationen bezüglich der <http://de.selfhtml.org/html/xhtml/unterschiede.htm@title=Unterschiede zwischen HTML und XHTML> (noch) nicht gelesen.
MfG,
EKKi
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Beschreibung der Seite</title>
</head>
<body>
<textarea name="one" cols="50" rows="10" disabled></textarea>
<textarea name="two" disabled>Text</textarea>
</body>
</html>
funktioniert trotzdem nicht.... und dieses Mal sollte es ein valider vollständiger Html Doctype sein.
Mahlzeit Sebastian Bauer,
funktioniert trotzdem nicht....
"Funktioniert nicht" funktioniert auch nicht.
und dieses Mal sollte es ein valider vollständiger Html Doctype sein.
Das ist richtig ... was aber willst Du jetzt eigentlich mit diesen Texteingabefeldern erreichen? Irgendwie ist mir das - trotzdem mittlerweile dreimaligem Lesen Deiner Beiträge in diesem Thread - nicht ganz klar ...
MfG,
EKKi
Mahlzeit Sebastian Bauer,
funktioniert trotzdem nicht....
"Funktioniert nicht" funktioniert auch nicht.
und dieses Mal sollte es ein valider vollständiger Html Doctype sein.
Das ist richtig ... was aber willst Du jetzt eigentlich mit diesen Texteingabefeldern erreichen? Irgendwie ist mir das - trotzdem mittlerweile dreimaligem Lesen Deiner Beiträge in diesem Thread - nicht ganz klar ...
was möchte ich erreichen: z.B. es sollen zwei Eingabefelder dargestellt werden, die zu Beginn sowohl disabled als auch enabled sein können.
<input type="text" name="two" value="" disabled="disabled">
<input type="text" name="three" value="" disabled>
dies funktioniert nicht, da beide Inputboxen disabled werden im IE
<input type="text" name="two" value="" disabled="disabled">
<input type="text" name="three" value="">
das würde funktionieren (mit disabled -> disabled | und ohne allem wird das Eingabefeld enabled dargestellt);
Jetzt kommt allerdings hinzu dass der User durch z.B. onClick() auf eine Checkbox die Eingabefelder disablen und enablen können soll. Hier kommt wahrscheinlich Javascript zum Einsatz.
Wenn ich jetzt allerdings jetzt folgendes Eingabefeld habe,
<input type="text" name="three" value="">
weiß ich nicht, wie ich dieses disabled darstellen soll.
document.two.disabled = =!document.check.checked;
check ist hier der Name der Checkbox.
Gruß
Sebastian
@@Sebastian Bauer:
nuqneH
document.two.disabled = =!document.check.checked;
Die Fehlerkonsole deines Browsers sollte dir hier einen Syntaxfehler melden.
Qapla'
Mahlzeit Sebastian Bauer,
was möchte ich erreichen: z.B. es sollen zwei Eingabefelder dargestellt werden, die zu Beginn sowohl disabled als auch enabled sein können.
<input type="text" name="two" value="" disabled="disabled">
<input type="text" name="three" value="" disabled>
> dies funktioniert nicht, da beide Inputboxen disabled werden im IE
Das funktioniert \*sehr wohl\*, denn dies ist im von Dir gewählten HTML-Standard (lt. Deiner vorherigen Postings 4.01 Transitional) beides vollkommen korrekt und wird absolut richtig dargestellt.
> ~~~html
> <input type="text" name="two" value="" disabled="disabled">
> <input type="text" name="three" value="">
>
das würde funktionieren (mit disabled -> disabled | und ohne allem wird das Eingabefeld enabled dargestellt);
Was bedeutet hierbei "würde funktionieren"? Wird es jetzt so dargestellt, wie Du es willst oder nicht?
Jetzt kommt allerdings hinzu dass der User durch z.B. onClick() auf eine Checkbox die Eingabefelder disablen und enablen können soll. Hier kommt wahrscheinlich Javascript zum Einsatz.
Nein. Nicht wahrscheinlich, sondern sogar sehr sicher.
Wenn ich jetzt allerdings jetzt folgendes Eingabefeld habe,
<input type="text" name="three" value="">
> weiß ich nicht, wie ich dieses disabled darstellen soll.
Indem Du <http://de.selfhtml.org/javascript/objekte/elements.htm#allgemeines@title=auf dieses Formularelement zugreifst> und seiner Eigenschaft "<http://de.selfhtml.org/javascript/objekte/elements.htm#disabled@title=disabled>" den gewünschten Wert <http://de.selfhtml.org/javascript/sprache/operatoren.htm#zuweisung@title=zuweist>.
> ~~~javascript
> document.two.disabled = =!document.check.checked;
>
Abgesehen vom IMHO extrem ungünstigen Zugriff auf die Elemente: was genau soll diese Kombination aus <http://de.selfhtml.org/javascript/sprache/operatoren.htm@title=Gleichheits- und Ausrufezeichen> bewirken ... außer Syntaxfehler im Parser[1]?
MfG,
EKKi
[1] Diese solltest Du im Übrigen *IMMER* mit angeben, wenn welche auftreten!
ich seh schon, ohne einem onload(javafunction) wird das nicht funktionieren. Der IE schaut sich nämlich nur an ob ein disabled vorhanden ist und disbled dann das Textfeld etc. einfach; egal ob es letztendlich disabled="disabled" oder nur disabled lautet.
Mahlzeit Sebastian Bauer,
Der IE schaut sich nämlich nur an ob ein disabled vorhanden ist und disbled dann das Textfeld etc. einfach; egal ob es letztendlich disabled="disabled" oder nur disabled lautet.
Herzlichen Glückwunsch - Du hast *einen* der <http://de.selfhtml.org/html/xhtml/unterschiede.htm@title=Unterschiede zwischen HTML und XHTML> (wie oft muss man Dir diesen Bereich von SELFHTML eigentlich noch verlinken, bis Du ihn liest und verstehst?) kennengelernt und offenbar mittlerweile verstanden.
Das hat mit dem IE wenig zu tun.
MfG,
EKKi
Hi,
scheinbar stelle ich mich etwas zu dumm an, aber es funktioniert immer noch nicht...
Doch - du verstehst „es“ nur noch nicht.
<textarea name="two" disabled>Text1</textarea>
<textarea name="three" disabled="disabled">Text2</textarea>
>
> Beide Textfelder werden disabled dargstellt im IE;
Du hast ja auch für beide angegeben, dass sie disabled sein \*sollen\* - nur eben mit zwei unterschiedlichen Schreibweisen, die der Parser aber beide erkennt.
> obwohl einmal disabled und einmal disabled="disabled" verwendet wurde...
Es bedeutet beides das gleiche.
Wenn du das Feld \*nicht\* disabled haben willst, dann gibst du dieses Attribut einfach gar \*nicht\* an.
Ist das wirklich so schwer ...?
MfG ChrisB
--
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
@@Sebastian Bauer:
nuqneH
if (document.myform.act1.checked) {
document.myform.duni1.disabled = false;
document.myform.sel1.disabled = false;
document.myform.d1node1.disabled = false;
document.myform.d1node2.disabled = false;
document.myform.d1node3.disabled = false;
document.myform.d1node4.disabled = false;}
else {
document.myform.duni1.disabled = true;
document.myform.sel1.disabled = true;
document.myform.d1node1.disabled = true;
document.myform.d1node2.disabled = true;
document.myform.d1node3.disabled = true;
document.myform.d1node4.disabled = true;
}
Du willst etliche disabled-Eigenschaften auf den http://de.selfhtml.org/javascript/sprache/operatoren.htm#logisch@title=negierten Wert von document.myform.act1.checked setzen? Das kannst du auch einfacher haben:
document.myform.duni1.disabled = !document.myform.act1.checked;
document.myform.sel1.disabled = !document.myform.act1.checked;
document.myform.d1node1.disabled = !document.myform.act1.checked;
document.myform.d1node2.disabled = !document.myform.act1.checked;
document.myform.d1node3.disabled = !document.myform.act1.checked;
document.myform.d1node4.disabled = !document.myform.act1.checked;
Oder auch als Einzeiler:
document.myform.duni1.disabled = document.myform.sel1.disabled = document.myform.d1node1.disabled = document.myform.d1node2.disabled = document.myform.d1node3.disabled = document.myform.d1node4.disabled = !document.myform.act1.checked;
Mit meiner letzten Frage meinte ich, ob man dieses Javascript auch mittels PHP etc. realisieren kann?
?? Dass Javascript und PHP zu völlig verschiedenen Zeiten an völlig verschiedenen Orten auseführt werden, ist dir klar?
Zwischen jedem Attribute in einem Inputfield muss mindestens ein Leerzeichen vorhanden sein, damit es valider Code ist?
Ja.* Und das ist nicht nur bei 'input'-Elementen so, sondern bei allen.
Qapla'
* Wenn mit Leerzeichen alle weißen gemeint sind. (Nicht lachen, ich hab whitespace wirklich schon als weißes Leerzeichen übersetzt gesehen. Nicht nachmachen!)
@@Sebastian Bauer:
nuqneH
<input type="checkbox"onclick="endisable()"id="act1" name="act1" style="background:none;"/>active
Invalides HTML: „Im Start-Tag eines Elements kann eine beliebige Anzahl von _durch Zwischenraum_ getrennten (zulässigen) Attribut-Wert-Paaren stehen.“ [HTML401 §3.2.2] (Hervorhebung von mir)
<select class="form-txtf3"id="sel1" name="sel1">
Dito.
Ich möchte gern zu Beginn, wenn der User die Seite anfordert in Abhängigkeit der Checkbox (gechecked oder nicht) die SelectBox auswählbar haben oder nicht...
Dann rufe die Funktion endisable()
beim Start der Seite auf.
Qapla'
Tach auch.
<input type="checkbox"onclick="endisable()"id="act1" name="act1" style="background:none;"/>active
<br />
Ich weise mal so nebenbei drauf hin, dass es durchaus möglich ist, deine De-/Aktivierung der Checkbox zu umgehen.
Die Checkbox mit Fokus versehen und dann mit Leertaste (de-)markieren bewirkt, dass onclick nicht (!) abgefeuert wird. Du willst wohl eher onchange versuchen.
Wobei ich mir da nicht mehr ganz sicher bin, ob das schon direkt nach dem Ändern im IE abgefeuert wird oder wie Text-Felder erst nach bzw. bei onblur (habe gerade keinen Windows-PC zur Hand für Tests).
Bis die Tage,
Matti
--
[Webapplikationen in C++ entwickeln](http://tntnet.org/)