per dropdown gewisse elemente eines Formulars einblende

R

ReemE

Mitglied
Hallo,

ich möchte, auswählbar durch ein Dropdown Menü, einzelne Elemente eines Formulares entweder aus oder einblenden.. Wie kann ich das realisieren

Hier ein Beispiel:


Code: 
<form action="main.php" method="post">
<table align="center">

<tr>
  <td class="content"><b>Ich bin ein/e:</b></td>
  <td class="content"><select name="status">

			<option value="1">option 1</option>
			<option value="2">option 2</option>
			<option value="3">option3</option>

               </select></td>
</tr>
// STANDARD
<tr>
 <td class="content"><b>Nachname:</b></td>
 <td class="content"><input type="text" name="nachname" size="50" maxlength="100" /></td>
</tr>
<tr>
 <td class="content"><b>Vorname:</b></td>
 <td class="content"><input type="text" name="vorname" size="50" maxlength="100" /></td>
</tr>

// NUR BEI OPTION 1
<tr>
 <td class="content">Stra&szlig;e / Nr:</td>
 <td class="content"><input type="text" name="strasse" size="50" maxlength="100" /> / <input type="text" name="nummer" size="9" maxlength="3" /></td>
</tr>

// NUR BEI OPTION 2
<tr>
 <td class="content">PLZ / Ort:</td>
 <td class="content"><input type="text" name="plz" size="5" maxlength="5" /> / <input type="text" name="ort" size="38" maxlength="100" /></td>
</tr>


// NUR BEI OPTION 3
<tr>
 <td class="content">Jahr:</td>
 <td class="content"><input type="text" name="jahr" value="XX / XX" size="10" maxlength="10" /></td>
</tr>

Danke für die Hilfe
 
hallo .. ich wollte nur fragen, ob ich mein Problem undeutlich ausgedrückt habe oder ob es so schwer ist, das zu realisieren...
Danke falls ihr das schafft ...
 
Hi;

ich hab hier mal ein Script für dich gemacht.
Falls ich dich richtig verstanden habe, sollte es deinen Vorstellungen entsprechen.

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript">
function wechsel()
{
var opt=document.anzeige.status.value;

if(opt=="1")
{
document.getElementById('neu').innerHTML="<td class=\"content\">Stra&szlig;e / Nr:</td><td class=\"content\"><input type=\"text\" name=\"strasse\" size=\"50\" maxlength=\"100\" /> / <input type=\"text\" name=\"nummer\" size=\"9\" maxlength=\"3\" /></td>";
}

else if(opt=="2")
{
document.getElementById('neu').innerHTML="<td class=\"content\">PLZ / Ort:</td><td class=\"content\"><input type=\"text\" name=\"plz\" size=\"5\" maxlength=\"5\" /> / <input type=\"text\" name=\"ort\" size=\"38\" maxlength=\"100\" /></td></tr>";
}

else if(opt=="3")
{
document.getElementById('neu').innerHTML="<td class=\"content\">Jahr:</td><td class=\"content\"><input type=\"text\" name=\"jahr\" value=\"XX / XX\" size=\"10\" maxlength=\"10\" /></td></tr>";
}
}</script>
<title></title>
</head>
<body>


<form name="anzeige" action="main.php" method="post">
<table align="center">

<tr>
  <td class="content"><b>Ich bin ein/e:</b></td>
  <td class="content"><select name="status" onchange="wechsel()">

			<option value="1">option 1</option>
			<option value="2">option 2</option>
			<option value="3">option3</option>

               </select></td>
</tr>
<tr>
 <td class="content"><b>Nachname:</b></td>
 <td class="content"><input type="text" name="nachname" size="50" maxlength="100" /></td>
</tr>
<tr>
 <td class="content"><b>Vorname:</b></td>
 <td class="content"><input type="text" name="vorname" size="50" maxlength="100" /></td>
</tr>
<tr id="neu"><td style="display:none;"></td></tr>
</table>
</form>
</body>
</html>

Anmerkungen für validen Code ->

-du musst das Script extern lagern
-ich habe den Teil "<td style="display:none;"></td>" nur hinzugefügt um den Code valide zu machen; falls du darauf verzichten willst, kannst du diesen Teil löschen .

Ansonsten viel Spass damit

Greetz
 
Parse error: parse error, unexpected T_STRING in /user/WWW/main.php(253) : eval()'d code on line 28

Das muss irgendwie an den Quotes liegen oder hab aber die Doublequotes mal mit singlequotes ersetzt und es kam der gleiche Fehler .. eigentlich komisch oder?
 
Zuletzt bearbeitet:
Ich kann dir so ohne Quelltext kaum weiterhelfen.

Also das Script an sich geht aber, oder?
 
ich habs mal ausprobiert.. aber es ging leider nicht ...

Code: 
function wechsel()
{
  var opt=document.anzeige.status.value;
  if(opt=="1")
    {
    document.getElementById('neu').innerHTML="<tr><td class=\"content\">Abi-Jahrgang:</td>
    <td class=\"content\"><input type=\"text\" name=\"abi\" size=\"10\" maxlength=\"10\" /></td>
    </tr>";
    }
  else if(opt=="2")
    {
    document.getElementById('neu').innerHTML="<td class=\"content\">Kürzel:</td><td class=\"content\"><input type=\"text\" name=\"kuerzel\" size=\"10\" maxlength=\"10\" /></td></tr>";
    }
  else if(opt=="3")
    {
    document.getElementById('neu').innerHTML=" ";
    }
}


das war das java script .. und der rest ist hier ..
Code: 
<form action="main.php" method="post">
<table align="center">
<tr>
 <td colspan="2">Die fett markierten Felder m&uuml;ssen ausgef&uuml;llt sein!<br /><br /></td>
</tr>
<tr>
  <td class="content"><b>Ich bin ein/e:</b></td>
  <td class="content"><select name="status" size="1" onchange="wechsel()">
 		<optgroup label="Bitte ausw&auml;hlen">
			<option value="1">Ehemalige/r</option>
			<option value="2">Lehrer/in</option>
			<option value="3">Sch&uuml;ler/in</option>
		</optgroup>
               </select> des GaD</td>
</tr>
<tr>
 <td class="content"><b>Nachname:</b></td>
 <td class="content"><input type="text" name="nachname" size="50" maxlength="100" /></td>
</tr>
<tr>
 <td class="content"><b>Vorname:</b></td>
 <td class="content"><input type="text" name="vorname" size="50" maxlength="100" /></td>
</tr>
<tr>
 <td class="content">Stra&szlig;e / Nr:</td>
 <td class="content"><input type="text" name="strasse" size="50" maxlength="100" /> / <input type="text" name="nummer" size="9" maxlength="3" /></td>
</tr>
<tr>
 <td class="content">PLZ / Ort:</td>
 <td class="content"><input type="text" name="plz" size="5" maxlength="5" /> / <input type="text" name="ort" size="38" maxlength="100" /></td>
</tr>
<tr>
 <td class="content"><b>eMail:</b></td>
 <td class="content"><input type="text" name="email" size="50" maxlength="100" /></td>
</tr>
<tr id="neu"><td style="javascript:display:none;"></td></tr>
<tr>
 <td class="content">Mitglied im <b><font size="+1">es</font></b>:</td>
 <td class="content"><input type="radio" name="esmitglied" value="es-Mitglied"  /> Ja <input type="radio" name="esmitglied" value="" checked="checked"/> Nein</td>
</tr>
<tr>
 <td valign="top" class="content" >Anmerkungen:</td>
 <td class="content"><textarea name="anmerkungen" cols="46" rows="7"></textarea></td>
</tr>
<tr>
 <td class="content">
 <input type="hidden" name="addme" value="true" />
<input type="hidden" name="modul" value="kontakte" />
<input type="hidden" name="submod" value="emailadd" /></td>
<td class="content">
<input type="submit" name="Eintragen" value="Eintragen" />
<input type="reset" />
</td>
</tr>
</table>
</form>

es muss sich aber irgendwo ein Fehler befinden, denn es geht so nicht und meine template Klasse bringt auch einen Parse Errror wenn ich es ausführ ...
 
Der Fehler ist eigentlich klein aber ganz entscheidend:

Code: 
    document.getElementById('neu').innerHTML="<tr><td class=\"content\">Abi-Jahrgang:</td>
    <td class=\"content\"><input type=\"text\" name=\"abi\" size=\"10\" maxlength=\"10\" /></td>
    </tr>";
Diesen Abschnitt musst du in einer Zeile schreiben->
Code: 
    document.getElementById('neu').innerHTML="<tr><td class=\"content\">Abi-Jahrgang:</td><td class=\"content\"><input type=\"text\" name=\"abi\" size=\"10\" maxlength=\"10\" /></td></tr>";
Dann sollte es keine Probleme geben ;)

Greetz
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück