nicht angemeldet
Formular....
Halli hallo!
Also, ich habe ein Formular und mitten im Formular ist mal eine selectbox. Vor der selectbox sind Formularfelder und danach auch. Wenn ich aus dieser selectbox was bestimmtes auswähle, dann solln unter der selectbox ein paar neue Textfelder aufgehn (und die Felder, die zuvor unter der selectbox waren, solln runterrücken). Wenn ich aus der selectbox wieder was anders auswähle, dann solln die neuen Felder auch wieder verschwinden und die fixen darunterliegenden Felder wieder direkt unter die selectbox rücken....
Kann man das machen?
Ich hab da mal einen Ansatz, aber leider verschwinden da nur die felder (Texte vor den feldern bleiben stehn) und wenn die Felder nicht sichtbar sind, dann ist ein leerer Fleck da und das darunterliegende fixe Feld wird nicht raufgerückt unter die selectbox:
<html>
<head>
<title></title>
<script language="Javascript">
function changeURL()
{
if (document.Form.lieferung_wohin.value == "adresse1")
{
document.Form.vorname.style.visibility = 'hidden';
document.Form.nachname.style.visibility = 'hidden';
document.Form.strasse.style.visibility = 'hidden';
document.Form.plz.style.visibility = 'hidden';
document.Form.ort.style.visibility = 'hidden';
document.Form.land.style.visibility = 'hidden';
}
if (document.Form.lieferung_wohin.value == "adresse2")
{
document.Form.vorname.style.visibility = 'visible';
document.Form.nachname.style.visibility = 'visible';
document.Form.strasse.style.visibility = 'visible';
document.Form.plz.style.visibility = 'visible';
document.Form.ort.style.visibility = 'visible';
document.Form.land.style.visibility = 'visible';
}
}
</script>
</head>
<body bgcolor="#ffffff" topmargin="10" onload="changeURL()" leftmargin="20">
<form name="Form" action="seite.asp" method="post">
<table border="0" cellpadding="2" cellspacing="0" width="635">
<tr>
<td class="text">
<select onchange="changeURL()" name="lieferung_wohin">
<option value="adresse1">wie Rechnungsadresse</option>
<option value="adresse2">ungleich der Rechnungsadresse</option>
</select>
</td>
</tr>
</table>
<!-- Felder -->
<table border="0" cellpadding="2" cellspacing="0">
<tr>
<td class="text">Vorname</td>
<td> </td>
<td class="text"><input type="text" name="vorname" size="34"></td>
<td> </td>
<td class="text">Nachname</td>
<td> </td>
<td class="text"><input type="text" name="nachname" size="34"></td>
</tr>
<tr>
<td class="text">Straße/Nr.</td>
<td> </td>
<td class="text" colspan="5"><input type="text" name="strasse" size="88"></td>
</tr>
<tr>
<td class="text">PLZ</td>
<td> </td>
<td class="text" colspan="5"><input type="text" name="plz" size="21"> Ort <input type="text" name="ort" size="21"> Land
<select name="land" style="font-size:11pt;width:115pt;">
<option value="Österreich">Österreich</option>
<option value="Deutschland">Deutschland</option>
</select>
</td>
</tr>
<tr>
<td class="text" colspan="7"> </td>
</tr>
<tr>
<td class="text"><b>fixesFeld*</b></td>
<td> </td>
<td class="text" colspan="5"><input type="text" name="fix" size="34"></td>
</tr>
</table>
</form>
</body>
</html>
Vielen Dank im Voraus für eure Hilfe!!!
-
Hallo karinsch,
Ich hab da mal einen Ansatz, aber leider verschwinden da nur die felder (Texte vor den feldern bleiben stehn) und wenn die Felder nicht sichtbar sind, dann ist ein leerer Fleck da und das darunterliegende fixe Feld wird nicht raufgerückt unter die selectbox:
[...]
document.Form.vorname.style.visibility = 'hidden';versuchs mal mit ...style.display = 'none'(=unsichtbar) bzw. 'inline'(=sichtbar)
-> http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#displayGrüße aus Nürnberg
Tobias -
tach,
Wenn ich aus dieser selectbox was bestimmtes auswähle, dann solln unter der selectbox ein paar neue Textfelder aufgehn (und die Felder, die zuvor unter der selectbox waren, solln runterrücken). Wenn ich aus der selectbox wieder was anders auswähle, dann solln die neuen Felder auch wieder verschwinden und die fixen darunterliegenden Felder wieder direkt unter die selectbox rücken....
Kann man das machen?Ja.
Ich hab da mal einen Ansatz
Der ist doch gar nicht so verkehrt. Anmerkungen dazu:
function changeURL()
müßte geprüft werden, wie weit das in allen Browsern funktioniert
<body bgcolor="#ffffff" topmargin="10" onload="changeURL()" leftmargin="20">
Der EventHandler "onload" scheint mir hier überflüssig, da du deine Funktion ja später dort (nochmal) aufrufst, wo sie tatsächlich arbeiten soll.
<form name="Form" action="seite.asp" method="post">
ähm ... Formularverarbeitung machst du wirklich mit ASP?
<table border="0" cellpadding="2" cellspacing="0" width="635">
<tr>
<td class="text">
<select onchange="changeURL()" name="lieferung_wohin">Hier steckt dein eigentliches Problem, das sich aber mit ein bißchen Überlegen erledigen lassen müßte. Du läßt deine Funktion innerhalb der selct-box ausführen, wodurch du dein Ergebnis bekommst. Dadurch werden halt auch nur die select-boxen versteckt/eingeblendet, die Tabelle selbst bleibt unverändert. Also steck deine Funktion doch einfach in die Tabellenzellen, blende eine Zelle ein/aus, dann ist dein Problem behoben ...
Grüße aus Berlin
Christoph S.
-
Also das mit dem "display" funktioniert!!!
Nur leider geht das ganze im NS nicht :-((
Und das mit den Texten vor den Feldern krieg ich auch nit hin. Ich selber kann ja kein Javascript. Jemand hat mir den Rat gegeben, das mit DOM zu machen. Hat da jemand zufällig ein Beispiel dafür?Danke!
-
hi,
Also das mit dem "display" funktioniert!!!
Schön, aber ein Ausrufezeichen hätte gereicht
Nur leider geht das ganze im NS nicht :-((
Kann auch nicht *g*
Jemand hat mir den Rat gegeben, das mit DOM zu machen. Hat da jemand zufällig ein Beispiel dafür?
Naja, ein bissel Javascript mußt du schon lernen, sonst geht gar nix. Ein Beispiel (allerdings nicht für Tabellen, sondern für DIV's) findest du im Archiv: http://forum.de.selfhtml.org/archiv/2002/9/23723/#m131273
Grüße aus Berlin
Christoph S.
-
-
-
Mal abgesehen von deinem Problem. Mit tut ein wenig dein Programmierstil weh ;-)
<script language="Javascript">
function changeURL()
{
if (document.Form.lieferung_wohin.value == "adresse1")
{
document.Form.vorname.style.visibility = 'hidden';
document.Form.nachname.style.visibility = 'hidden';
document.Form.strasse.style.visibility = 'hidden';
document.Form.plz.style.visibility = 'hidden';
document.Form.ort.style.visibility = 'hidden';
document.Form.land.style.visibility = 'hidden';
}
if (document.Form.lieferung_wohin.value == "adresse2")
{
document.Form.vorname.style.visibility = 'visible';
document.Form.nachname.style.visibility = 'visible';
document.Form.strasse.style.visibility = 'visible';
document.Form.plz.style.visibility = 'visible';
document.Form.ort.style.visibility = 'visible';
document.Form.land.style.visibility = 'visible';
}
}
</script>Da sollte doch sofort sichtbar sein, was da verbessert werden kann:
function showForm(form, show)
{
var vis = show ? 'visible' : 'hidden';
form.vorname.style.visibility = vis;
form.nachname.style.visibility = vis;
form.strasse.style.visibility = vis;
form.plz.style.visibility = vis;
form.ort.style.visibility = vis;
form.land.style.visibility = vis;
}Die alte funktion:
------------------
function changeURL(form)
{
if (form.lieferung_wohin[form.lieferung_wohin.selectedIndex].value == "adresse1") showForm(form, false);
if (form.lieferung_wohin[form.lieferung_wohin.selectedIndex].value == "adresse2") showForm(form, true);
}Und der Aufruf:
---------------
<select onchange="changeURL(this.form);" name="lieferung_wohin">BZW. im Body Tag:
-----------------
<body .... onload="changeURL(document.Form);">