(Stand: 22.12.24, Adresse: http://www.grammiweb.de/anleitungen/ka_variablen.shtml)
Seitenübergreifende Variablenübergabe
Sei es nun bei der Erstellung von Onlineshops, beim Auswerten von Tests oder bei längeren Formularen - die Übergabe von Variablen von einer Seite auf eine andere ist eine häufig benötigte Funktion, die rein per HTML leider nicht realisierbar ist. Eine Möglichkeit der Übergabe wollen wir Ihnen hier vorstellen.
In dieser Kurzanleitung gehen wir von der Grundproblematik aus, dass in einem Bestellvorgang nach der Versandart und der Zahlungsweise gefragt werden soll. Die angebotenen Möglichkeiten können in Drop-Down-Menüs gewählt werden.
Hierzu müssen also erst einmal die Menüs erstellt werden. Dies wird über den folgenden Quellcode erreicht:
<form name="form">
<table>
<tbody>
<tr>
<td>Versandart</td>
<td><select name="versand" size="1">
<option selected value="1">Kurier</option>
<option value="2">Abholung</option>
<option value="3">Post</option>
</select></td>
</tr>
<tr>
<td>Zahlungsweise</td>
<td><select name="zahlung" size="1">
<option selected value="1">Bankeinzug</option>
<option value="2">Bar</option>
<option value="3">Rechnung</option>
</select></td>
</tr>
<tr>
<td colspan="2"><input onclick="auswertung();" type="button"
value=" Weiter "></td>
</tr>
</tbody>
</table>
</form>
Dem Formular wird der Name "form" gegeben (blau gekennzeichnet). In diesem Formular sind die beiden Menüs eingebettet, die "versand" (rote Kennzeichnung) und "zahlung" (Orange) betitelt werden. Eine Schaltfläche unterhalb der Drop-Down-Menüs ruft bei Betätigung die JavaScript-Funktion "auswertung()" (Pink) auf, die im Anschluss definiert wird.
Die im BODY-Segment eingebettete Funktion "auswertung()" greift nun die durch das Formular ermittelten Werte ab und weist sie Variablen zu. Hierzu wird der jeweilige Wert, der im obigen Script durch VALUE="Wert" zugewiesen wurde, ausgelesen. Sehen Sie sich das Formularscript an, sehen Sie beispielsweise beim Versandmenü, dass folgende Werte vorgegeben wurden:
Kurier: Wert "1"
Abholung: Wert "2"
Post: Wert "3"
Diese Inhalte der Versandauswahl werden in die Variable "a" übergeben (rote Markierung), die der Zahlungsweise in "b" (orange gekennzeichnet).
Im Folgenden wird die Variable "URL" (blau) definiert, die als Inhalt zum einen einen Seitennamen erhält (in unserem Beispiel die Datei "seite2.htm", auf der dann die Auswertung der Eingaben stattfinden soll), zum anderen wird ihr ein Fragezeichen angehängt, hinter dem die beiden Variablenwerte "a" und "b" platziert werden. Das Fragezeichen sowie alle dahinter stehenden Informationen werden von Internetbrowsern als nicht zur Adresse gehörend gewertet, so dass sich diese Methode für die Auswertung und die Übergabe von Variablen eignet.
Würden dem obigen Formular entsprechend also die Optionen "Kurier" (Wert 1 im Versandmenü, Variable "a") und "Rechnung" (Wert 3 im Zahlungsmenü, Variable "b") gewählt, würde die nun in der Variable "URL" gespeicherte Information "seite2.htm?13" lauten. Dieser Wert wird nun an die JavaScript-Routine "window.location" übergeben, die nun diese Seite aufruft (physikalischer Name ist "seite2.htm").
<script
LANGUAGE="JAVASCRIPT">
function auswertung(){
a = document.form.versand.options
[document.form.versand.selectedIndex].value;
b = document.form.zahlung.options
[document.form.zahlung.selectedIndex].value;
URL='seite2.htm?'+a+b;
window.location=URL;
}
</script>
Auf der aufgerufenen Seite "seite2.htm" müssen die "angehängten" Werte nun wieder ausgelesen werden. Die geschieht im HEAD-Bereich mittels des folgenden Scripts:
<script
language="javascript">
var uebernahme=new String(document.location.href);
var uebergabe=uebernahme.indexOf("?");
var a=new
String(uebernahme.substring(uebergabe+1,uebergabe+2));
var b=new
String(uebernahme.substring(uebergabe+2,uebergabe+3));
if(a==1) versand="Kurier";
if(a==2) versand="Abholung";
if(a==3) versand="Post";
if(b==1) zahlung="Bankeinzug";
if(b==2) zahlung="Bar";
if(b==3) zahlung="Rechnung";
</script>
Der Variablen "a" (rote Kennzeichnung) wird der erste Wert hinter dem Fragezeichen zugewiesen, wobei dieser exakt eine Position beträgt (in der Angabe "uebergabe+1" wird der Startpunkt, also die Position des Fragezeichens +1, festgelegt, mit "uebergabe+2" wird der Endpunkt definiert, also das zweite Zeichen hinter dem Fragezeichen). Der Variablen "b" (orange) wird entsprechend eine Position weiter zugeteilt.
Nun sind dem "Anhängsel "?13" also wieder beiden Werte entnommen worden und diese in Variablen gespeichert worden. Im Folgenden werden diesen Werten entsprechend die für die Auswertung benötigten Variablen "versand" und "zahlung" zugeordnet.
Hierbei wird der Wertigkeit der Variable "a" entsprechend einer der Werte "Kurier", "Abholung" oder "Post" zugewiesen (dunkelrot gekennzeichnet). Beinhaltet "a" also den Wert "1", erhält die Variable "versand" den Inhalt "Kurier", bei "2" "Abholung" und bei "3" "Post". Die gleiche Auswertung wird für die Variable "b" beziehungsweise deren Ausgabe "zahlung" (dunkelorange markiert) durchgeführt.
Diese Auswertung erfolgt nun, indem die Variablen "versand" und "zahlung" ausgegeben werden. Dies geschieht über die JavaScript-Funktion "document.write()" in Verbindung mit der Variablenbezeichnung.
<table>
<tbody>
<tr>
<td>Versandart</td>
<td><script
language="javascript">document.write(versand)</script></td>
</tr>
<tr>
<td>Zahlungsweise</td>
<td><script
language="javascript">document.write(zahlung)</script></td>
</tr>
</tbody>
</table>
Das war's schon.
Sicherlich gibt es auch andere Methoden, Werte zwischen Seiten zu übertragen. Die hier vorgestellte ist eine relativ einfache und unproblematische Möglichkeit, die sich in nahezu allen Situationen einsetzen lässt.
Das in dieser Kurzanleitung verwendete Beispiel können Sie sich nun "in der Praxis" anschauen oder downloaden.
[an error occurred while processing this directive] [an error occurred while processing this directive]© Grammiweb.de Internetlösungen. Alle Rechte vorbehalten. Stand: 22.12.2024
Seitenanfang - Sponsor werden - Datenschutz - Medien - Impressum - Werbung - Hilfe - Kontakt