Willkommen in der Webstatt
User-1 am 10.01.07 20:43

Hi,
Ich bin auf der Suche nach ein paar Codeschnipseln für ein intelligentes Formular mit JavaScript. Man soll mit einem Dropdownmenü das darunterliegende Formular beeinflußen können, also je nachdem was man auswählt sieht das Formular anders aus.
Inaktive Formularelemente sollen komplett ausgeblendet werden.

Gibt es sowas? Kann mir jemand helfen?

netcup.de Warum gibt es hier Werbung?
User-2 am 10.01.07 20:47

Dies könntest du mit einigen Span's lösen.
Per Javascript wird das jeweilige Form/der Text im Span liegendem Bereich eingeblendet.

Wenn du den Code willst, wende dich an mich ;)

User-1 am 13.01.07 12:40

Genau sowas hatte ich auch schon überlegt, kann es nur nicht umsetzen.
Wäre nett wenn ihr mir mit paar Codeschnipseln weiterhelfen könntet :)

User-3 am 13.01.07 12:47

Naja, dann kriegt das <select>-Element ein onChange-Attribut, durch das ein Javascript die Auswahlmöglichkeit überprüft und andere Elemente ein- oder ausblendet (Sprichwort CSS: display )

User-2 am 14.01.07 03:42

Javascript:
<script language="JavaScript" type="text/javascript">
function ChangeForm (Number) {
if (Number == "1") {
document.getElementById("Form1").style.display = "";
document.getElementById("Form2").style.display = "none";
document.getElementById("Form3").style.display = "none";
document.getElementById("Form4").style.display = "none";
}
if (Number == "2") {
document.getElementById("Form1").style.display = "none";
document.getElementById("Form2").style.display = "";
document.getElementById("Form3").style.display = "none";
document.getElementById("Form4").style.display = "none";
}
if (Number == "3") {
document.getElementById("Form1").style.display = "none";
document.getElementById("Form2").style.display = "none";
document.getElementById("Form3").style.display = "";
document.getElementById("Form4").style.display = "none";
}
if (Number == "4") {
document.getElementById("Form1").style.display = "none";
document.getElementById("Form2").style.display = "none";
document.getElementById("Form3").style.display = "none";
document.getElementById("Form4").style.display = "";
}
}
</script>

Den Javascript einfach nach belieben erweitern (wenn du mehr brauchst und nicht weiterkommst, sag bescheid)

Hier das Select zum wechseln:
<form name="wechseln">
<select name="wechselnsel" onChange="ChangeForm(options[this]);">
<option value="1">Form1</option>
<option value="2">Form2</option>
<option value="3">Form3</option>
<option value="4">Form4</option>
</select>
</form>

User-4 am 14.01.07 12:07

mal abgesehen davon, dass da eine klammer zu fehlt, is doch da ne schleife um einiges praktischer oder?
viel weniger code

User-5 am 15.01.07 17:23

grml [FONT=courier new][COLOR=red]this.[/COLOR]options[this][/FONT]
aber wie gesagt, mach lieber ne schleife drum ;)

User-2 am 16.01.07 20:14

[hust]peinlich[/hust] :D

Creative Commons Lizenzvertrag
Alle Inhalte des Webstatt-Archivs stehen unter einer Creative Commons Namensnennung - Weitergabe unter gleichen Bedingungen 3.0 Unported Lizenz.

Impressum & Kontakt