Input-Feld anzeigen nach klick auf radio

Kracky

Mitglied
Hallo,

Ich habe mir ein Formular erstellt indem auch eine Frage kommt ob man man seine Eingaben privatisieren möchte.
Man hat also 2 Radio Felder, einmal Öffentlich und einmal Privat.

Bei Öffentlich soll garnichts passieren und wenn man Privat anklickt, erscheint ein Eingabefeld wo man ein Passwort eingeben muss.

Das ganze habe ich jetzt versucht mit Ajax zu lösen.

Das Javascript sieht wie folgt aus:

Code:
function radio_password(password)
{
    if (password=="private")
    {
       document.getElementById("output_pw").innerHTML="<div class=\"turnier_right2\"><div class=\"password_fix\"><div class=\"font1\">Turnier-Kennwort:</div></div><input type=\"text\" name=\"password\" class=\"turnier_password\"></div>";
       return;
    }
	else
	{
		document.getElementById("output_pw").innerHTML="";
		return;
	}
    if (window.XMLHttpRequest)
    {
       // AJAX nutzen mit IE7+, Chrome, Firefox, Safari, Opera
       xmlhttp=new XMLHttpRequest();
    }
    else
    {
       // AJAX mit IE6, IE5
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
       if (xmlhttp.readyState==4 && xmlhttp.status==200)
       {
           document.getElementById("output_pw").innerHTML=xmlhttp.responseText;
       }
    }
}

Das Eingabefeld wird also angezeigt.

Wenn ich aber jetzt das Formular an die seite zum auswerten schicke, wird die Passwort-Variable nicht mit übergeben.

Notice: Undefined index: password in F:\xampp\htdocs\script\turnier\check_create.php on line 5

PHP:
$password 		= $_POST['password'];

Wie schaffe ich es jetzt, das die Passwort Variable mit übergeben wird?
 
Warum so kompliziert.

Blende das Textfeld zunächst per CSS Angabe aus und wenn dann jemand auf Privat Klickt, blendest du es ein.

Sichtbar: der Inhalt wird übertragen
Unsichtbar: der Inhalt wird nicht übertragen
 
Ok, die inhalte befinden sich aber in verschiedenen DIVs.
Wie sag ich denn in CSS das wenn radio 1 in div X angeklickt wird, das input feld in div Y angezeigt wird?
 
Habe es nochmal geändert.

Jetzt wird der Status und die ID des Textfeldes übergeben, ist kürzer.

Javascript:
<script language="javascript" type="text/javascript">
function radio_click(checked, id) {
if (checked == true) {
  document.getElementById(id).style.display = "block";
} else {
  document.getElementById(id).style.display = "none";
}
}
</script>
HTML:
<input type="checkbox" name="check1" id="check1" onclick="radio_click(this.checked, 'feld1')" />
<br />
<input type="text" name="feld1" id="feld1" value="Feld 1" size="20" maxlength="50" style="display: none;"/>
<p>----------------------------------</p>
<input type="checkbox" name="check2" id="check2" onclick="radio_click(this.checked, 'feld2')" />
<br />
<input type="text" name="feld2" id="feld2" value="Feld 2" size="20" maxlength="50" style="display: none;"/>
 
Zuletzt bearbeitet:
Danke,
mit den Checkboxen funktioniert das ja ganz gut, mit den Radios leider nicht.

Ich habe es jetzt soweit das wenn man auf private klickt es erscheint und wenn man auf public klickt verschwindet es.

Das einzige Problem ist leider, das es standartmäßig beim Seitenaufruf erstmal angezeigt wird obwohl ich bei public noch checked gemacht hab.

Erst wenn ich Private einmal angeklickt habe und danach wieder auf public klicke verschwindet es.

Code:
function check_password()
	{
		if (document.getElementById("private").checked == true) 
		{
		document.getElementById("pass_visibility").style.display = 'block';
		}
		else
		{
		document.getElementById("pass_visibility").style.display = 'none';
		}
	}

HTML:
<div class="publicity_left">
<input type="radio" name="publicity" value="public" id="public" onclick="check_password()" checked="checked">Öffentlich
</div>
<div class="publicity_right">
<input type="radio" name="publicity" value="private" id="private" onclick="check_password()">Privat
</div>

<div class="turnier_right2" id="pass_visibility">
<div class="password_fix">
<div class="font1">Turnier-Kennwort:</div>
</div>
<input type="text" name="password" class="turnier_password">
</div>
 
So geht es:

Javascript:
<script language="javascript" type="text/javascript">
function check_password(checked, id) {
if (checked == "private") {
  document.getElementById(id).style.display = "block";
} else {
  document.getElementById(id).style.display = "none";
}
}
</script>

HTML:
<div class="publicity_left">
<input type="radio" name="publicity" value="public" id="public" onclick="check_password(this.id, 'password')" checked="checked">Öffentlich
</div>
<div class="publicity_right">
<input type="radio" name="publicity" value="private" id="private" onclick="check_password(this.id, 'password')">Privat
</div>

<div class="turnier_right2" id="pass_visibility">
<div class="password_fix">
<div class="font1">Turnier-Kennwort:</div>
</div>
<input type="text" name="password" id="password" class="turnier_password" style="display: none;"/>
</div>
 
Da ich keinen neuen "Fred" eröffnen will, klinke ich mich mal mit einem ähnlichen Problem ein. Ich poste mal nur Code-Fragmente:

Bei Click auf das SELECT-Element

Code:
<Select id="extra_payment" name="extra_payment" size="1" 
onclick="document.getElementById('jump_group').style.display = 'block' ;"> options blablabla </select>

soll das SELECT-Element

Code:
<select id="jump_group" name="jump_group" size="1" style="display:none"> options blablabla </select>

eingeblendet werden.

Und das will einfach nicht klappen. Ohne jegliche Fehlermeldung im Entwicklermodus.

Das gleiche Konstrukt mit dem input-Attribut Disabled klappt witzigerweise.

Hat jemand eine Idee? Danke im Voraus.
 
Bei Click auf das SELECT-Element

Code:
<Select id="extra_payment" name="extra_payment" size="1"
onclick="document.getElementById('jump_group').style.display = 'block' ;"> options blablabla </select>

soll das SELECT-Element

Code:
<select id="jump_group" name="jump_group" size="1" style="display:none"> options blablabla </select>

eingeblendet werden.
<select> erfordert den onchange-Event anstatt onclick.

Siehe z.B. http://wiki.selfhtml.org/wiki/HTML/Formulare/Auswahllisten#Absendewert_von_Eintr.C3.A4gen_bestimmen
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück