nicht angemeldet
Moin.
Das wirft aber Probleme auf:
<script>
function zeigePreis() {
var preis = 59.90; switch (document.getElementById('preiswahl').selectedIndex) { case 0 : preis = 59.90; break; case 1 : preis = 170.96; break; case 2 : preis = 399.78; break; default: 59.90; } document.getElementById('preis').innerHTML = preis + " €";}
> </script>
> </head>
> <body onload="zeigePreis()">
> <p>
> <span id="preis"></span>
> <select id="preiswahl" onchange="zeigePreis()">
> <option value="1" selected="selected">pro Nacht</option>
> <option value="2">pro Woche</option>
> <option value="3">pro Monat</option>
> </select>
> </p>
> <noscript>Diese Seite verwendet JavaScript zur Berechnung.</noscript>
> </body>
> </html>[/code]
... dürfte zu einer Ausgabe wie "59.9 €" führen.
geringfügig nachgebessert:
~~~javascript
// var preis = '59.90'; siehe default
switch (document.getElementById('preiswahl').selectedIndex) {
case 0 : preis = '59.90'; break;
case 1 : preis = '170.96'; break;
case 2 : preis = '399.78'; break;
default: '59.90';
}
wenn wir dann schon dabei sind: Die Daten stammen ja offensichtlich aus PHP. Dann würde ich das auch weitgehend benutzen wollen...
Hier mein Funktionsbeispiel, dass, weil es nur ein Beispiel ist, noch eine ganze Menge Verbesserungspotential hat.
Ich würde z.B. noch mehr parametrisieren wollen (pro Nacht ... pro Woche ... pro Monat ... ? als Array + hash) und dann daraus die Options erzeugen. Und ich würde auch ein richtiges Template verwenden wollen.
Was ich auf keinen Fall machen würde, wäre dem zurückgesendeten Preis zu vertrauen.
$_REQUEST durch den korrekten Hash der Wahl ($_POST/$_GET) ersetzen. Es gibt - außerhalb des (meines) Testes keinen Grund diese Einschränkung nicht zu treffen.
Das Beispiel funktioniert aber erst mal fehlerfrei.
<?php
# Defaults
$curr = '€';
$decPoint=',';
# Daten:
$Preis[0]=59.9;
$Preis[1]=170.96;
$Preis[2]=399.78;
if ( isset($_REQUEST['selection']) ) {
$selection=intval($_REQUEST['selection']);
} elseif ( isset($_REQUEST['preiswahl']) ) {
$selection= intval($_REQUEST['preiswahl']);
} else {
$selection=0;
}
?><!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Bestellen</title>
<style type="text/css">
</style>
<script type="text/javascript">
function zeigePreis() {
var dPreis = <?php print $Preis[0]; ?>;
var sPreis = "<?php print str_replace('.', $decPoint, sprintf("%1.2f $curr", $Preis[0])); ?>";
var s=document.getElementById('preiswahl').selectedIndex;
if (1==s) {
var dPreis = <?php print $Preis[1]; ?>;
var sPreis = "<?php print str_replace('.', $decPoint, sprintf("%1.2f $curr", $Preis[1])); ?>";
}
if (2==s) {
var dPreis = <?php print $Preis[2]; ?>;
var sPreis = "<?php print str_replace('.', $decPoint, sprintf("%1.2f $curr", $Preis[2])); ?>";
}
document.getElementById('sPreis').innerHTML = sPreis;
document.getElementById('selection').value = s;
document.getElementById('dPreis').value = dPreis;
document.getElementById('bestellen').value = "Zum Preis von " + sPreis + " bestellen.";
}
</script>
</head>
<body onload="document.getElementById('noscript_submit').type='hidden';">
<form name="auswahl" action="<?php print $_SERVER['PHP_SELF']; ?>" method="GET">
<select name="preiswahl" id="preiswahl" onchange="zeigePreis()">
<option value="0" <?php if (0==$selection) {print 'selected="selected"';} ?> >pro Nacht</option>
<option value="1" <?php if (1==$selection) {print 'selected="selected"';} ?> >pro Woche</option>
<option value="2" <?php if (2==$selection) {print 'selected="selected"';} ?> >pro Monat</option>
</select>
<input id="noscript_submit" type="submit" value="wählen" />
</form>
<noscript>Diese Seite verwendet JavaScript zur Berechnung der Anzeige. Das Beispiel geht aber auch ohne Javascript.</noscript>
<p>Der Spaß kostet <span id="sPreis"><?php print str_replace('.', $decPoint, sprintf("%1.2f $curr", $Preis[$selection])); ?></span>.</p>
<form name="bestellen" method="GET" action="<?php print $_SERVER['PHP_SELF']; ?>">
<input type="text" name="selection" id="selection" value="<?php print $selection; ?>" />
<input type="text" name="dPreis" id="dPreis" value="<?php print $Preis[$selection]; ?>"><input id="bestellen" type="submit" value="Zum Preis von <?php print str_replace('.', $decPoint, sprintf("%1.2f $curr", $Preis[$selection])); ?> bestellen" />
</form>
</body>
</html>
Vorteil: dPreis (in Javascript) steht dann für weitere Berechnungen zur Verfügung, kann z.B. auch im ein zusätzliches verstecktes Formularfeld eingetragen werden, was nützlich für die weitere serverseitige Verarbeitung ist.
Hinweis: Natürlich wäre es eine gute Idee, sich etwas wie ein Template zu bauen oder ein template-System zu benutzen.
Das Skript zeigt aber sehr schön das "klassische Zusammenspiel" von Javascript, HTML und PHP. Freilich gänge mit "Ajax" oder XMLHttpRequests auch so einiges. Das hebe ich aber für das nächste Mal auf.
Der Martin
Matthias Apsel