✔ Textarea in Abhängigkeit mehrer Checkboxen ein/ausblenden

[frysee]

Hi,
nach erfolgloser Rumsucherei und Rumprobiererei wende ich mich einfach mal an euch

Ziel:
Mithilfe einer Reihe von Checkboxen soll eine Textarea entweder ein- oder ausgeblendet werden.
Dabei gilt:

• mehr als eine Checkbox markiert: Textarea eingeblendet
• Eine/Keine Checkbox markiert: Textarea ausgeblendet

Problem hierbei:
Nachdem die Checkboxen akriviert/deaktiviert werden, muss immer zuerst noch ein weiterer Klick an eine beliebige Stelle erfolgen, bevor sich der Zustand der Textarea ändert - Ich denke mal der Hund liegt beim OnChange-Event begraben, das wird nämlich erst aufgerufen wenn die angeklickte Checkbox den Focus verliert.

Ich hoffe mal auf nen Schubser in die richtige Richtung, im Folgenden noch der Code, den ich mir zusammengeschnipselt habe:

Der Javascript-Teil:

<script type='text/javascript'>
function Systeme (formular)
{
var gruppe = new Array('system0', 'system1','system2','system3','system4','system5','system6','system7','system8','system9');
var anzahlMarkiert = 0.
var maxErlaubt = 2;

    for (var i = 0; i < gruppe.length; i++)
    {
        if (formular.elements[gruppe[i]].checked == true)
            anzahlMarkiert++;
        if (anzahlMarkiert === maxErlaubt)
            break;
    }
    if (anzahlMarkiert === maxErlaubt)
    {
        document.form.mreason.style.display = "";
    }
    else
    {
        document.form.mreason.style.display = "none";
        }
}
</script>

...Und die zugehörigen Checkboxen und die Textarea:

<form>
<!-- checkboxen
    <input type="checkbox" NAME="system0" class="toggleEnable2" onChange="Systeme(this.form);">
    <input type="checkbox" NAME="system1" class="toggleEnable2" onChange="Systeme(this.form);">
    <input type="checkbox" NAME="system3" class="toggleEnable2" onChange="Systeme(this.form);">
    <input type="checkbox" NAME="system4" class="toggleEnable2" onChange="Systeme(this.form);">

<!-- textarea
    <textarea class="textarea" id="mreason" name="mreason" type="text"
        onfocus="if(this.value='Reason why you selected multiple systems') {this.value=''}"
        onblur="if(this.value=='') {this.value='Reason why you selected multiple systems'}"
        style="display:none; font-family:univers;">Reason why you selected multiple systems</textarea>
</form>

greetz

 

[kuddeldaddeldu]

Hi,

ersetze onchange durch onclick.

LG

 

[frysee]

Oh Mann, danke :-(

Manchmal ists so naheliegend, ich schäm mich fast.

greetz

 

[Maik]

Hi,

deinem vorgestellten HTML-Code zufolge schließt du die HTML-Kommentare nicht ordnungsgemäß, was zu unterschiedlichen Fehlinterpretationen / -darstellungen des Codes in den einzelnen Browsertypen führt:

<form>
<!-- checkboxen -->
    <input type="checkbox" NAME="system0" class="toggleEnable2" onChange="Systeme(this.form);">
    <input type="checkbox" NAME="system1" class="toggleEnable2" onChange="Systeme(this.form);">
    <input type="checkbox" NAME="system3" class="toggleEnable2" onChange="Systeme(this.form);">
    <input type="checkbox" NAME="system4" class="toggleEnable2" onChange="Systeme(this.form);">

<!-- textarea -->
    <textarea class="textarea" id="mreason" name="mreason" type="text"
        onfocus="if(this.value='Reason why you selected multiple systems') {this.value=''}"
        onblur="if(this.value=='') {this.value='Reason why you selected multiple systems'}"
        style="display:none; font-family:univers;">Reason why you selected multiple systems</textarea>
</form>

Oder waren die beiden Kommentare lediglich der Community gewidmet, und stehen in dieser Form überhaupt nicht in deinem Code?

Dann hab ich nix gesagt ;-)

mfg Maik

 

[frysee]

Hi,
wie du schon erkannt hast, waren die Kommentare nur schnell eingefügt, um das ganze etwas übersichtlicher zu gestalten - der Quelltext ist dann doch etwas umfangreicher :suspekt:

Dank kuddeldaddeldu hab ich mein "Problem" schon lösen können - wie ich schon sagte wars so einfach, dass ich mich fast schäme :-(

greetz