Archiv verlassen und diese Seite im Standarddesign anzeigen :
Formularproblem
folgendes
ein Terminreservierungsformular für zwei messen...
der Kunde soll die Messe aus einer Selectbox auswählen und dann die Tage der ausgewählten Messe angezeigt bekommen.
Läßt sich das mit javascript lösen ohne das die komplette Seite neu lädt und schon vom Kunden eingetragene Daten verloren gehen? Wenn ja wie???
wahrscheinlich nur mit Hilfe von Frames.
ansonsten gehts nur über onchange ...
wie mit Hilfe von Frames ich kann in nem Formular doch keine Frames machen...:confused:
und ich kann gar kein JavaScript... wäre hilfreich wenn ihr den code posten könntet!!!!
also mit Frames kann ich dir auch nicht so weiterhelfen, meine Idee wäre :
linkes Frame "die Tage der ausgewählten Messe" und rechts "Messe auswählen"
ansonsten geht halt nur mit neuladen:
<form name=test>
<select name="messe" size="5"
onchange="self.location.href='http://www.deine-Seite.de/blabla.php?id='+document.test.messe.value">
<option value="1">CeBit</option>
<option value="2">Automesse :( </option>
<option value="3">Leipziger Buchmesse</option>
</select>
</form>
ähm...ich kann in einem FORMULAR keine Frames machen!!!!
nein. aber du kannst doch der select box sagen, dass wenn der User eine Änderung vornimmt, er das linke Frame neuladen soll.
aber was hast du gegen die andere Lösung !?
WELCHE FRAMES ich hab hier keine Frames und ich werde auch keine einbauen.....
Welche andere Lösung? onchange? dann sag mir was ich schreiben muß damit das zweite select-feld aktualisiert wird ohne das die Seite komplett neu geladen wird und schon eingetragene Daten verloren gehen...
MoRtAlAn 17-05-2002, 13:58
nimm den code, der is zwar hingeschmiert, aber funzt:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function messeauswahl(x)
{
if(x == "messe1")
{
document.formular.auswahl.value="01.01.1001";
}
else if(x == "messe2")
{
document.formular.auswahl.value="02.02.2002";
}
}
//-->
</script>
</head>
<body bgcolor="#EEEEEE">
<form name="formular">
<select size="1" name="selectauswahl" onChange="messeauswahl(this.form.selectauswahl.options[this.form.selectauswahl.options.selectedIndex].value)">
<option value="default">[ Messe auswählen ]</option>
<option value="messe1">Messe 1</option>
<option value="messe2">Messe 2</option>
</select>
<input type="text" name="auswahl">
</form>
</body>
</html>
soweit ich mich auskenne geht es nur mit neuladen.
du gibt dem ersten select feld "messe" eine id, wenn der user dort eine andere messe auswählt, liest du über id die messetermine für die neuausgewählte messe aus. die Seite lädt sich aber neu und alle bisher vorhanden einträge gehen verloren ...
MoRtAlAn 17-05-2002, 14:03
nein es geht auch ohne neuladen, weil dann wäre Javascript nutzlos!
probier mal den Code aus, da ändert sich im dritten feld nichts!! (schreib aber was anderes rein!)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function messeauswahl(x)
{
if(x == "messe1")
{
document.formular.auswahl.value="01.01.1001";
}
else if(x == "messe2")
{
document.formular.auswahl.value="02.02.2002";
}
}
//-->
</script>
</head>
<body bgcolor="#EEEEEE">
<form name="formular">
<select size="1" name="selectauswahl" onChange="messeauswahl(this.form.selectauswahl.options[this.form.selectauswahl.options.selectedIndex].value)">
<option value="default">[ Messe auswählen ]</option>
<option value="messe1">Messe 1</option>
<option value="messe2">Messe 2</option>
</select>
<input type="text" name="auswahl">
<input type="text" name="hallo" value="reinschreib">
</form>
</body>
</html>
Mort und das funktioniert ohne das die Seite neu lädt und DAten aus dem restlichen Formular verloren gehen?
jo er hat recht.
entschuldigt !!!!:(
@Aroree : er lädt die Seite nicht neu
sorry, dass ich nicht helfen konnte
kein Problem snoova du hast es wenigstens versucht und das zählt!!! :):love:
MoRtAlAn 17-05-2002, 14:09
jepp, geht OHNE neu laden!
gebe aber nur garantie für den IE, andere hab ich gerade nciht greifbar!
gruss
aber du hast in dem Code ja jetzt nur eine Auswahl er soll mir aber in einer weiteren Selectbox mehrere Daten angeben
geht das auch?
ja das würde mich jetzt auch mal interessiern
ich habe es bisher immer nur durch neuladen gelöst !
MoRtAlAn 17-05-2002, 14:25
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function messeauswahl(x)
{
if(x == "messe1")
{
document.formular.auswahl.value="01.01.1001";
document.formular.ergebnisauswahl.value="erg1";
}
else if(x == "messe2")
{
document.formular.auswahl.value="02.02.2002";
document.formular.ergebnisauswahl.value="erg2";
}
else if(x == "default")
{
document.formular.auswahl.value="";
document.formular.ergebnisauswahl.value="leer";
}
}
//-->
</script>
</head>
<body bgcolor="#EEEEEE">
<form name="formular">
<select size="1" name="selectauswahl" onChange="messeauswahl(this.form.selectauswahl.options[this.form.selectauswahl.options.selectedIndex].value)">
<option value="default">[ Messe auswählen ]</option>
<option value="messe1">Messe 1</option>
<option value="messe2">Messe 2</option>
</select>
<input type="text" name="auswahl">
<select size="1" name="ergebnisauswahl">
<option value="leer">[ keine Messe ausgewählt ]</option>
<option value="erg1">Ergebnis 1</option>
<option value="erg2">ergebnis 2</option>
</select>
</form>
</body>
</html>
setzt jetzt bei bedarf sogar auf defaultwerte zurück, wenn keine Messe mehr ausgewählt ist :D
gruss
ich glaube du hast es falsch verstanden.
ich habe zwei messen die jeweils mehrer Tage dauern
die leute können sich eine Messe aussuchen dann sollen die Tage der Messe in der zweiten Selectbox angezeigt werden, damit die Leute sich einen Tag aussuchen können an dem sie zur Messe kommen zum Beratungsgespräch...
Kollege hat mir geholfen...
die Version funktioniert jetzt...
function messeauswahl(x)
{
if(x == "messe1")
{
document.forms['reservierung'].tag.options.length=0;
document.forms['reservierung'].tag.options[0]=new Option("Dienstag, 04.06.02", "Dienstag, 04.06.02");
document.forms['reservierung'].tag.options[1]=new Option("Mittwoch, 05.06.02", "Mittwoch, 05.06.02");
document.forms['reservierung'].tag.options[2]=new Option("Donnerstag, 06.06.02", "Donnerstag, 06.06.02");
}
else if(x == "messe2")
{
document.forms['reservierung'].tag.options.length=0;
document.forms['reservierung'].tag.options.length=0;
document.forms['reservierung'].tag.options[0]=new Option("Donnerstag, 06.06.02", "Donnerstag, 06.06.02");
document.forms['reservierung'].tag.options[1]=new Option("Freitag, 07.06.02", "Freitag, 07.06.02");
document.forms['reservierung'].tag.options[2]=new Option("Samstag, 08.06.02", "Freitag, 07.06.02");
}
}
Bitte wählen Sie eine Messe aus<br>
<select size="1" name="selectauswahl" onChange="messeauswahl(this.options[this.options.selectedIndex].value)">
<option value="messe1" selected>Internet World 04.06 - 06.06</option>
<option value="messe2">digital behaviour 06.06 - 08.06</option>
</select>
<select name="tag">
<option value="--">- Tag -</option>
</select>
MoRtAlAn 17-05-2002, 15:01
schade, gerade hatte ich es auch... Und meine Funzt mit ner Browserweiche (sollte in PHP kein Prob sein) sogar in allen Browsern :))
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>MouseOver</title>
<script language="JavaScript">
function init() {
//Browser IE
document.all.messeauswahl0.style.visibility = "hidden"
document.all.messeauswahl1.style.visibility = "hidden"
document.all.messeauswahl2.style.visibility = "hidden"
document.all.messeauswahl3.style.visibility = "hidden"
//Browser NS
/*document.messeauswahl0.visibility = "hidden"
document.messeauswahl1.visibility = "hidden"
document.messeauswahl2.visibility = "hidden"
document.messeauswahl3.visibility = "hidden"*/
//Browser Opera
/*document.getElementById("messeauswahl0").style.visibility = "hidden"
document.getElementById("messeauswahl1").style.visibility = "hidden"
document.getElementById("messeauswahl2").style.visibility = "hidden"
document.getElementById("messeauswahl3").style.visibility = "hidden"*/
}
function messeauswahl(n) {
for (var i=0; i<=3; i++) {
var visi = (i==n) ? "visible" : "hidden"
//Browser IE
document.all("messeauswahl"+i).style.visibility = visi
//Browser NS
//document.layers["messeauswahl"+i].visibility = visi
//Browser Opera
//document.getElementById("messeauswahl"+i).style.visibility = visi
}
}
</script>
</head>
<body onload="init()">
<br><br><br><br><br><br><br>
<form>
<select size="1" name="selectauswahl" onChange="messeauswahl(this.form.selectauswahl.options[this.form.selectauswahl.options.selectedIndex].value)">
<option value="0">[ Messe auswählen ]</option>
<option value="1">Messe 1</option>
<option value="2">Messe 1</option>
<option value="3">Messe 2</option>
</select>
<span id="messeauswahl0" style="position:absolute">bei default kein selectfeld</span>
<span id="messeauswahl1" style="position:absolute">
<select name="test1">
<option value="wert1">Datum1-2</option>
<option value="wert2">Datum1-2</option>
</select>
</span>
<span id="messeauswahl2" style="position:absolute">
<select name="test2">
<option value="wert1">Datum2-1</option>
<option value="wert2">Datum2-2</option>
</select></span>
<span id="messeauswahl3" style="position:absolute">
<select name="test3">
<option value="wert1">Datum3-1</option>
<option value="wert2">Datum3-2</option>
</select>
</span>
<form>
</body>
</html>
hey das sieht echt gut aus...
vielleicht baue ich das nochmal um :)
Vielen Dank auf jedenfall!!!
|
