nicht angemeldet
Nach ZURÜCK im Browser ist die SELECT-Auswahl futsch
0 0 SPAM ALERT
Nach ZURÜCK im Browser ist die SELECT-Auswahl futsch
Hallo,
ihr könnt mir bestimmt helfen !?
Ich versuche, Auswahllisten auf einer Seite dynamisch aufzubauen,
ähnlich der Kategorienauswahl bei Ebay.
Wählt man einen Eintrag in einem Menü aus, sollen die dazugehörigen
Unterpunkte im nächsten Menü erscheinen.
Das klappt auch soweit, nur: Schickt man dann das Formular ab
oder geht auf eine ganz andere Seite und dann wieder zurück
per back() oder "Zurück" im Browser, ist alles wieder wie ganz
am Anfang, die getroffene Auswahl ist futsch.
Ich will hier meinen Code nicht wiedergeben, der ist unnötig lang,
um dieses Detailproblem zu veranschaulichen, aber ich habe auf
folgender SELFHTML-Seite etwas entdeckt, das genau mein Problem
in wenigen Zeilen wiedergibt:
http://selfhtml.teamone.de/javascript/objekte/anzeige/option_neue_elemente.htm
Wird eine neue OPTION eingefügt, dann irgend eine andere Seite
im Browser aufgerufen und dann zurückgekehrt per ZURÜCK,
befindet sich die Seite im Anfangszustand, die Selektion ist
verschwunden.
Komischerweise habe ich das bisher nur bei Formularfeldern vom
Typ SELECT beobachtet, INPUT-Felder bleiben erhalten, auch wenn
ihr Inhalt vom Script generiert wurde.
Jedenfalls gleicht mein Code an dieser Stelle dem SELFHTML-Code,
gibt´s eine Lösung ?
Viele Grüße
Achim.
PS: Ich habe mir den Ebay-Code (Verkaufen/Kategorienauswahl)
gründlich angesehen, aber die "entscheidende Stelle" einfach nicht
ausfindig machen können. Denn: Beim Ebay-Code tritt das Problem
nicht auf.
PPS: Gibt´s Antiquitätenfreunde unter Euch, Möbel, technische
Sachen etc ?
-
bis du sicher, dass du im ausgangsformular kein "selected" in einer der options hast?
lgz
Hallo,
ihr könnt mir bestimmt helfen !?
Ich versuche, Auswahllisten auf einer Seite dynamisch aufzubauen,
ähnlich der Kategorienauswahl bei Ebay.Wählt man einen Eintrag in einem Menü aus, sollen die dazugehörigen
Unterpunkte im nächsten Menü erscheinen.Das klappt auch soweit, nur: Schickt man dann das Formular ab
oder geht auf eine ganz andere Seite und dann wieder zurück
per back() oder "Zurück" im Browser, ist alles wieder wie ganz
am Anfang, die getroffene Auswahl ist futsch.Ich will hier meinen Code nicht wiedergeben, der ist unnötig lang,
um dieses Detailproblem zu veranschaulichen, aber ich habe auf
folgender SELFHTML-Seite etwas entdeckt, das genau mein Problem
in wenigen Zeilen wiedergibt:http://selfhtml.teamone.de/javascript/objekte/anzeige/option_neue_elemente.htm
Wird eine neue OPTION eingefügt, dann irgend eine andere Seite
im Browser aufgerufen und dann zurückgekehrt per ZURÜCK,
befindet sich die Seite im Anfangszustand, die Selektion ist
verschwunden.Komischerweise habe ich das bisher nur bei Formularfeldern vom
Typ SELECT beobachtet, INPUT-Felder bleiben erhalten, auch wenn
ihr Inhalt vom Script generiert wurde.Jedenfalls gleicht mein Code an dieser Stelle dem SELFHTML-Code,
gibt´s eine Lösung ?Viele Grüße
Achim.PS: Ich habe mir den Ebay-Code (Verkaufen/Kategorienauswahl)
gründlich angesehen, aber die "entscheidende Stelle" einfach nicht
ausfindig machen können. Denn: Beim Ebay-Code tritt das Problem
nicht auf.PPS: Gibt´s Antiquitätenfreunde unter Euch, Möbel, technische
Sachen etc ?-
bis du sicher, dass du im ausgangsformular kein "selected" in einer der options hast?
Hallo, nein, ich habe noch nicht einmal eine "OPTION" drin !
Werden alle mit new Option('xxx',...) angelegt...-
Gugucks,
ich habe dein Problem schon gestern zur Kenntnis genommen, und zwar mit Schrecken, dieweil es mich in ähnlicher Weise für ein Projekt auch betreffen wird. Ich erzeuge die <option>s nicht dynamisch (jedenfalls nicht via JS) sondern zeige eine Select-Liste via Zuweisung einer css-Klasse (display:block respektive display:none) entweder an oder nicht. Der Effekt ist aber derselbe wie bei dir. Sobald es über history.back() zurückgeht, sind die Selectliste und die Userauswahl verschwunden.
Also dachte ich zunächst in meinem Sinn: Na gut, dann speichern wir eben in einem <input type="hidden"> ab, ob die Select-Liste angezeigt wurde oder nicht und im zweiten Hidden-Field wird der selectedIndex gespeichert.
Über onload im body wird eine Funktion showSelectOnload() aufgerufen, die nach den Angaben in den versteckten Feldern die Liste entweder anzeigt oder eben nicht. Wieder nix. Die Werte aus hidden-Fields bleiben genausowenig erhalten wie die select-Liste selbst.Nächster Versuch: unsichtbare Textfelder mit display:none. Wieder nix: Wenn Textfelder display:none haben, werde sie vom Browser offenbar als hidden-Fields gehandelt und alles ist wech.
Versuch Nummer 3: unsichtbare Textfelder mit visibility:hidden und alles auf 0 Pixel setzen, was nur auf 0 Pixel zu setzen geht:
visibility:hidden;width:0px;height:0px;margin:0px;padding:0px;
border:0px;font-size:0px;Das funktioniert im Prinzip. Nur mag der IE das mit dem 0px nicht so recht akzeptieren. Also habe ich meine pseudoHiddenFields in ein div gepackt, dass die Eigenschaft display:none hat. Der IE tut dann, was ich möchte, was eigentlich nicht ganz logisch ist: Denn wenn das DIV müßte seine Eigenschaft display:none ja auf die in ihm stehende input-Fields übertragen und dasselbe machen, wie wenn die inputs selber display:hidden hätten.
Und siehe da: Mozilla reagiert entsprechend: Wenn <input type="text" /> in div mit display:none, dann sind wieder alle Werte weg. Also einen hübschen CSS-Käfer des IE ausnutzen und die style-Eigenschaften für IE und Mozi unterschiedlich formatieren, für IE display:none, für Mozi display:block;Anbei mal der Quältext, und die Frage an den Rest der Gemeinde, obs denn nicht was Simpleres gibt :-))
Liebe Grüße, Uschi
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Das Prob mit den dynamisch erstellten Select-Listen</title>
<style type="text/css">/* Klasse für unsichtbare Selectliste, wird als Default im Tag eingetragen */
.invisible {display:none}
/* Klasse für sichtbare Selectliste, wird dynamisch durch die Funktionen
* showSelect und showSelectOnload zugewiesen
*/.show {display:block}
/* Klasse zum Unsichtbarmachen von Textfeldern. Damits mit der Formatierung
* sowohl für Mozi als auch den IE klappt, müssen diese Felder in einem div
* der Klasse invisDiv stehen, vgl. unten
*/.pseudoHidden {
visibility:hidden;
width:0px;
height:0px;
margin:0px;
padding:0px;
border:0px;
font-size:0px;
}/*
* Klasse für ein DIV, in dem die Pseudohiddenfelder stehen. Für den IE muss dieses
* DIV display:none haben, sonst brauchen die Formularfelder nämlich Platz, obwohl
* alles Mögliche in .pseudoHidden auf 0 gesetzt ist.
* Für Mozi hingegen muß das DIV gedisplayed werden.
*/.invisDiv {
display:none; /* Anweisung für den IE */
voice-family:""}""; /* ab hier liest der IE nicht mehr mit */
display:block; /* Anweisung für Mozi */
}</style>
<script language="JavaScript">/**
* @function showSelect(idSel, idKeepText)
* @Aufgabe: Zeigt auf ein bestimmtes Ereignis hin eine bis dahin versteckte
* select-Liste an und setzt zwecks Erhaltung derselben bei history.back()
* ein Pseudo-Hiddenfield auf "1".
* @Param: idSel, STRING, die id der fraglichen Selectliste
* idKeepText, STRING, id des Pseudo-Hiddenfelds
*/
function showSelect(idSel, idKeepText) {
document.getElementById(idKeepText).value = "1";
document.getElementById(idSel).className = "show";
document.getElementById("anzeigen").innerHTML = document.getElementById("keepSelect").value;
}/**
* @function showSelectOnload(idSel,idKeepText, idSelectedText)
* @Aufgabe: Liest anhand eines Pseudo-Hiddenfields aus, ob eine bestimmte
* Selectliste angezeigt werden soll und setzt anhand eines zweiten
* Pseudo-Hiddenfields den selectedIndex.
* @Aufruf: im body onload
* @Param: idSel, STRING, die id des fraglichen select-Elements
* idKeepText, STRING, die id des Pseudo-Hiddenfields für anzeigen
* idSelText, STRING, die id des Pseudo-Hiddenfields für selectedIndex
*/
function showSelectOnload(idSel,idKeepText,idSelText) {
if(document.getElementById(idKeepText).value == "1") {
document.getElementById(idSel).className = "show";
document.getElementById(idSel).selectedIndex = document.getElementById(idSelText).value;
}
}/**
* Setzt den selectedIndex auf den Wert eines via id übergeben Pseudo-Hiddenfields
* wird onchange im select-Element aufgerufen
* Parameter: elSel, OBJECT, die selectliste, übergeben mit this
* idText, STRING, die id des Textfeldes, in dem der Wert gespeichert werden soll
*/
function setSelectedIndex(elSel, idText) {
document.getElementById(idText).value = elSel.selectedIndex;
}
</script>
</head>
<body style="margin:0px;padding:0px" onload="showSelectOnload('mySelect','keepSelect','keepSelectedIndex')">
<select id="mySelect" class="invisible" onchange="setSelectedIndex(this,'keepSelectedIndex')">
<option>wenigstens was</option>
<option>rot</option>
<option>blau</option>
<option>grün</option>
</select>
<!-- hierhin die Pseudo-Hiddenfields, also input type="text" aber unsichtbar -->
<div class="invisDiv" style="background-color:#ffff00">
<input class="pseudoHidden" type="text" id="keepSelect" name="keepSelect" value="0" />
<input class="pseudoHidden" type="text" id="keepSelectedIndex" name="keepSelect" value="0" />
</div>
<div style="background-color:#ff0000" onclick="showSelect('mySelect','keepSelect')">Selectliste azeigen</div>
<div style="background-color:#00ffff"><a href="textarea.html">weiter</a></div>
</body>
</html>
-
-
-
</?m=140663&t=25702>
</?m=140742&t=25718>