Per JS und Dropdown-Menü Label ändern?

Hallo zusammen,
Ich lade per PHP eine JSON-Datei in ein Dropdown-Menü. Die JSON-Datei enthält mehrere Objekte mit Namen und Preis. Jetzt möchte ich per JS den Preis dazu in einem extra Label errechnen, nur weiß ich nicht wie...

Habt ihr Ideen oder auch "nur" Lösungsansätze?

LG Checker0408

Answer 1

[RakonDark]

wenn du das so bekommst also (ich nehme hier mal JQuery)

    function postData(thePath) {
        $.post(selectAjaxPhp,
        {
            pfad: thePath
        },
/* antowrt vom php an resultAjax funktion übergeben */
        function(data){
            resultAjax(data);
        });
    }

kannst du mit

function resultAjax(theData) {
/* werte von php sturktur JSON in variable ablegen */
        mydata = JSON.parse(theData);
        /* restliche optionen hinzufügen */
        for (var i=0; i < mydata.length; ++i) {
            $("#idvomselect").append('<option value="'+mydata[i].nr+'/">'+mydata[i].gericht+'</option>');
        /* irgendwas mit ...  mydata[i].preis ... machen */       
        }
  }

darauf zugreifen in einer schleife und das verarbeiten , optionen bauen etc .

Deine Beschreibung ist leider sehr dürftig.

Answer 2

[EinAlexander]

Per JS und Dropdown-Menü Label ändern?

So ganz wird aus Deinem Post nicht klar, was Du willst (Was ist ein "Dropdown-Menp Label"?) Aber vielleicht hilft Dir das weiter?

<?php
$arr = json_decode('[{"nr":"1","gericht":"Gericht 1","preis":"1 EUR"},{"nr":"2","gericht":"Gericht 2","preis":"2 EUR"}]');
echo "<ul>";
foreach ($arr as $value) {
    echo "<li>Nr: ".$value->nr;
    echo "<li>Gericht: ".$value->gericht;
    echo "<li>Preis: ".$value->preis;
}
echo "<ul>";

Alex

Answer 3

[regex9]

Mit Dropdown-Menü meinst du doch eher ein select-Element, oder nicht?

In dem Fall solltest du mit PHP dafür sorgen, dass jedes option-Element den Preis und den Anzeigenamen herausrendert:

<select id="meals">
  <option value="2">Gericht 1</option>
  <option value="2">Gericht 2</option>
</select>  

Nun kannst du dich mit JavaScript an das Element anhängen und den Inhalt eines Paragraphen bspw. entsprechend ändern:

<p id="output"></p>
<script>
  var outputLabel = document.getElementById("output");

  document.getElementById("meals").addEventListener("change", function() {
    outputLabel.innerText = this.value;
  });
</script>

Was da nun noch berechnet werden sollte, müsstest du allerdings genauer erklären.

Answer 4

[Franky12345678]

Was genau hast du vor?

Erst mit PHP in HTML-Elemente rendern, um sie clientseitig mit JavaScript daran herumdoktorn... Hmmm naja.... entweder oder ;).

Ich würde hier das JSON auch als solches nutzen (var irgendeineVariable = jsonblabla; oder AJAX) und dann die Tabelle daraus komplett javascriptseitig rendern (Tabelle mit paar for-Schleifen zusammensetzen und dann entsprechend in DOM einfügen). Dann hast du clientsetig die volle Kontrolle darüber und musst nicht die Daten erst wieder umständlich aus dem DOM rausparsen. Zudem ist es dann meist einfacher, per AJAX den einen oder anderen Datensatz nachzuladen und nachträglich einzufügen.

Das hätte noch einen Vorteil: Der User wird nicht mit einer so halb funktionierenden Seite zurückgelassen, wenn er JavaScript deaktiviert hat. Dann sieht er gar keine Tabelle, dafür aber (hoffentlich) den Hinweis, das er das JavaScript einschalten soll.

Woher ich das weiß: Hobby