Feld per Drop-Down erscheinen lassen

armuelle

Grünschnabel
Hallo Leute,

ich habe eine Frage bzgl. eines Formulars.
Ich erstelle derzeit ein Bewerbungsformular und habe ein Drop-Down Menu mit Universitäten angelegt. Diese werden aus einer DB-Tabelle gezogen und angezeigt. Nun möchte ich gerne bei der Auswahl des Punktes "Sonstiges" ein Feld erscheinen lassen, in dem man eine andere Universität eingeben kann.

Hier das Füllen des DD:

Code:
function unidrop(){
		$data = "SELECT * FROM university";
		$myData = mysql_query($data);

		while ($record = mysql_fetch_array($myData)) {
			echo '<option value="' . $record['name'] . '">' . $record['name'] . '</option>';

			}

	}


Hierein Auszug des HTML-Formulars und ein JavaScript Code, den ich gefunden habe:

Code:
<script type="text/javascript">
<!--
    window.onload = function() {
        var radioPrivate = document.getElementById('sonstigeUni');
        radioPrivate.onclick = function() {
            var input = document.getElementById('andereUni');
            input.style.display = 'block';
        }
        
    }
-->
</script>
	

	
       

<p>Universit&aumlt<select name = "university"> 
		<?php  unidrop() ?>
		
		
	</select>
	

	<input name = "andereUni" style="display:none; " id="andereUni" /> </p>



Das Problem was nun besteht, ist dass ich in der Methode unidrop eine ID mitgeben müsste, und diese dann innerhalb des Javascript-Parts abfragen müsste oder?
Kann mir einer von euch weiterhelfen?

Vielen Dank im Voraus!

MFG
Arndt
 
Hi,

die Option "Sonstige" hat sicherlich eine bestimmte Position im Select-Feld (z.B. am Ende). Für diesen Fall könntest du den aktuell gewählten Index zum Vergleichen verwenden.
Code:
<html>
<head>
<title>tutorials.de</title>
<meta name="author" content="Quaese">
<script type="text/javascript">
window.onload = function(){
    document.getElementsByName('university')[0].onchange = function(){
        document.getElementById('andereUni').style.display = (this.selectedIndex === this.getElementsByTagName('option').length-1) ? "" : "none";
    }
}
</script>
</head>
<body>
    <p>Universit&aumlt<select name = "university">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="sonstige">sonstige</option>
    </select>
    <input name="andereUni" style="display:none; " id="andereUni" /> </p>
</body>
</html>
Hier wird das Input eingeblendet, wenn der Index der gewählten Option die letzte ist (Länge der Optionen - 1).

Ciao
Quaese
 

Neue Beiträge

Zurück