Input mit multiplen Values

Ralfnator

Grünschnabel
Folgendes Problem:

Eine Dropdownliste (Element eines Formulare mit mehreren Feldern) wird per PHP und MYSQL-Abfrage vordefiniert. Es handelt sich um eine Produktauswahl. Als VALUE lasse ich die Produkt-ID hinterlegen, weil diese über SUBMIT weiterverarbeitet bzw. zusammen mit den anderen Feldinhalten in der DB gespeichert werden muss. Gleichzeitig müsste ich aber auch über JS und einen Eventhandler sofort auf den Produktpreis zugreifen und diesen verarbeiten. Hier kann ich ja aber nur auf den VALUE zugreifen und das ist ja die ID und nicht per Preis.

Wie könnte ich das lösen? Können Values auch Array aus z. Bsp. 2 Werten (ID/Preis) sein?

Danke im Voraus.
 
Zuletzt bearbeitet:
Ist das eine Auswahlliste (select-Tag)? Das value-Attribut ist ja keine Variable sondern nur ein String, in dem Du beliebige Inhalte ablegen kannst, auch eine Kombination aus ID und Preis. Mit JS könntest Du dann den Preis heraus ziehen und im onsubmit den Preis entfernen (oder in deinem PHP-Skript). Eleganter würde ich es aber finden, wenn Du den Preis in einem data-Attribut ablegen würdest, dann ist er von vorn herein separat. Oder in einem assoziativen Array mit ID als Schlüssel.
 
Zuletzt bearbeitet:
Danke dir erstmal. Ja, es ist ein sql-befülltes Select-Element. Die Idee, als Value eine Verkettung aus Preis und ID zu übergeben, kam mir auch grade. Dann halt den Preis über JS herausfiltern und die ID über PHP. Hmm. Würde gehen. Ist aber net schön.

Deine Ansätze mit dem Data Attribut bzw. dem Array verstehe ich nicht. Kannst du mir mit nem Beispiel auf die Sprünge helfen? Danke
 
data-Attribute:
Code:
<form>
<p>Ihre Pizza-Bestellung:</p>
<select name="Pizza" onchange="alert(this.form.Pizza.options[this.form.Pizza.selectedIndex].getAttribute('data-preis'))">
<option data-preis="7,90" value="P101">Pizza Napoli</option>
<option data-preis="8,90" value="P102">Pizza Funghi</option>
<option data-preis="9,90" value="P103">Pizza Mare</option>
</select>
</form>
 
Grade fertig mit Internet-Recherche. Das ist genau das, was ich brauche. Ich werde bei den Quellen nur nicht aus der korrekten Syntax schlau, mit der ich über JS der Wert abrufen kann. Kannst du mir anhand des Beispiel das noch erläutern?
 
Anscheinend haben sich unsere Postings überschnitten, siehe mein voriges. Die Syntax siehst Du im onchange-Handler, ich habe sie von hier:
http://wiki.selfhtml.org/wiki/HTML/Formulare/Auswahllisten

Array:
Code:
<script>
var preise = {"P101": "7,90", "P102": "8,90", "P103": "9,90"};
</script>
<p>Ihre Pizza-Bestellung:</p>
<select name="Pizza" onchange="alert(preise[this.form.Pizza.value])">
<option value="P101">Pizza Napoli</option>
<option value="P102">Pizza Funghi</option>
<option value="P103">Pizza Mare</option>
</select>
</form>
Hier ist die Syntax für den Zugriff kürzer.
 
Ok, ich kriege es doch nicht auf die Kette und per JS das übergebene DATA-Attribut ausgelesen.

Hier der Code meines SELECT-Elements:

Code:
<select class='dropdown' size='1' id='jump_type' name='jump_type' disabled onchange=display_price1()>
    <option value='' disabled selected style='display:none;'>Sprung</option>
    <?php
    include('connect.php');
    $abfrage = "SELECT * FROM jump_prices WHERE category != 5 ORDER BY name ASC";
    $ergebnis = mysqli_query($conn,$abfrage)
    OR die("Error: $abfrage<br>".mysqli_error());
    while($row = mysqli_fetch_assoc($ergebnis))
        {
            echo "<option date-price='".$row['price']."' value='".$row['id']."'>".$row['name']." - ".$row['altitude']." m</option>";
        }
    mysqli_close($conn); 
    unset($conn);
    ?>
  </select>

Mit welcher Syntax kann ich nun über JS das DATA-Attribute der ausgewählten Option abgreifen?
 
Versuch's mal so:
Code:
onchange="display_price1(this);"
Code:
function displayprice1(ele) {
     price = ele.options[ele.selectedIndex].getAttribute("data-price");
}
(Du hattest die Hochkommas im onchange vergessen.)
 
Danke dir erstmal. Warum führt er aber die Funktion auch aus, wenn ich die Hochkommas weglasse bzw. welchen Unterschied macht es dann?
 
Zurück