Von Radio Button Abhängige Formularfelder via javascript ein-/ausblenden

Hallo zusammen,

ich stehe auch grade vor dem Problem in einem Formular Felder in Abhängigkeit von Radio Buttons ein- und auszublenden. Da es radio Buttuns sein müssen, gehts mit der Conditional Forms Erweiterung leider nicht.

Konkret geht es darum:
http://modelfruitys.brandtmark.me/de...okampagne.html
Wenn man bei Staatangehörigkeit "Andere" auswählt soll ein Textfeld eingeblendet werden, in dem die Staatangehörigkeit eingetragen erden soll und ein weiteres Radio Button Menü (Arbeitsgenehmigung ja/nein).

Händisch via HTML hab ichs hier
http://modelfruitys.brandtmark.me/de...ort-model.html
schon gelöst bekommen; hier nochmal das Markup für sich:

HTML-Code:

---

<div class="form_element">
  <label for="ctrl_84">
    Staatsangehörigkeit<span class="mandatory">*</span> <img src="system/themes/default/images/show.gif" alt="Hilfstext" class="helpicon" />
    <em class="helpmessage">Wenn Ihre Staatsangehörigkeit NICHT Deutsch ist klicken sie unten.</em>
  </label>
  <div id="ctrl_84" class="radio_container mandatory  validate['required']">
    <input type="hidden" name="staatsangehörigkeit" value="" />
    <span><input type="radio" name="staatsangehörigkeit" id="opt_84_0" class="radio mandatory  validate['required']" value="Deutsch" onclick="if(this.checked) { $('condition_andere_staatsangehoerigkeit').style.display='none'; } else { $('condition_andere_staatsangehoerigkeit').style.display='block'; }"/>
        <label id="lbl_84_0" for="opt_84_0">Deutsch</label>
    </span>
    <span>
        <input type="radio" name="staatsangehörigkeit" id="opt_84_1" class="radio" value="Andere" onclick="if(this.checked) { $('condition_andere_staatsangehoerigkeit').style.display='block'; document.getElementById('other_country').className='text validate[\'required\']'; document.getElementById('arbeitsgenehmingung_other_1').className='radio validate[\'required\']'; } else { $('condition_andere_staatsangehoerigkeit').style.display='none'; }" />
    </span>
    <label id="lbl_84_1" for="opt_84_1">Andere</label>
  </div>
</div>
<div id="condition_andere_staatsangehoerigkeit" style="display: none">
    <div class="form_element">
        <label for="other_country">Staatsangehörigkeit wenn nicht Deutsch<span class="mandatory">*</span></label>
    <input type="text" name="Staatsangehörigkeit_wenn_nicht_Deutsch" id="other_country" class="text" value="" />
    </div>
    <div class="form_element">
        <label for="ctrl_87" class="mandatory">
            <span class="invisible">Pflichtfeld</span> Arbeitsgenehmigung Deutschland<span class="mandatory">*</span>
        </label>
        <div id="ctrl_87" class="radio_container mandatory">
            <input type="hidden" name="Arbeitsgenehmigung" value="" />
            <span>
                <input type="radio" name="Arbeitsgenehmigung[]" id="arbeitsgenehmingung_other_1" class="radio" value="ja" />
                <label id="lbl_87_0" for="opt_87_0">ja</label>
            </span>
            <span>
                <input type="radio" name="Arbeitsgenehmigung[]" id="arbeitsgenehmingung_other_2" class="radio" value="nein" />
                <label id="lbl_87_1" for="opt_87_1">nein</label>
            </span>
        </div>
    </div>
</div>

---

Nur werden die eingegeben Formulardaten dann nicht via Mail verschickt (es soll auch eine Bestätigungsmail vias EFG rausgehen), eine händische Lösung via HTMl geht also nicht.

im ersten Fall habe ich das radiobutton Feld ganz normal über den Formulargenerator erzeugt; hier kann ich ja aber kein onclick Event auf den Radio Button legen. (Die Felder für die andere Staatangehörigkeit sind übrigens vorhanden und via inline style ausgeblendet)

Mein Gedanke ist nun der - und ich hoffe, da kann mir jemand helfen -, dass man das Script nicht auf das Onclick event legt sondern als eigenen javascript Code ins Seitenlayout schreibt.

Ich bin nun aber nicht Javascript firm genug, um das umzusetzen. Also, "Wenn input mit der id x ausgewählt ist, selektiere das div mit der id y und setze das style attribut auf sichtbar bzw. display: block.

Wenn mir da jemand helfen könnte, wäre das toll.

Dann hab ich da noch ein zweites kleines Problem: Zur Validierung nutze ich die Formcheck Erweiterung (hat übrigens einen Bug bei der Validierung von radio Buttons, aber das hab ich mittlerweile über das moo_formcheck.tpl gelöst bekommen; hoffe aber auf ein Update der Extension). Wenn ich die conditionalen Felder nun von vornherein als Pflichtfelder definiere und diese nicht ausgefüllt werden, weil die Staatsangehörigkeit Deutsch ist greift natürlich die Validierung und meckert (sind ja per se da, nur ausgeblendet). Wie oben in meinem Testmarkup zu sehen, habe ich die notwendige Klasse via Javascript angehängt (validate['required']), die klasse wird auch brav angehängt, wenn man nun Andere Staatsangehörigkeit auswählt, jedoch nicht validiert, da zum Zeitpunkt, als das formcheck Script aufgerufen wurde die Klasse eben noch nicht da war.

Weiss evtl. noch jemand, wie man dem Abhilfe schaffen könnte, also validierung nur, wenn "Andere" ausgewählt wurde?

Gruß

Dennis