Foren
Neue Beiträge
Foren durchsuchen
Was ist neu?
Neue Beiträge
Profilnachrichten
Online
Anmelden
Registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Neue Beiträge
Foren durchsuchen
Menü
Anmelden
Registrieren
App installieren
Installieren
Programmierung
JavaScript
Text von Option auslesen und darstellen
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Auf Thema antworten
Beitrag
[QUOTE="Sempervivum, post: 13164, member: 3917"] Sieh dir dies an, das ist die Implementierung meines ersten Vorschlags: [CODE=javascript] const // Der Button für das Einfügen: insertBtn = document.querySelector('#insert-btn'), // Die Tabelle mit der Buchführung für die Karten: subject = document.querySelector('#subject'); insertBtn.addEventListener('click', () => { const // Die Option, die ausgewählt wurde: selectedOption = document.querySelector('#select-card option:checked'), // Das value-Attribut in der Option: cardValue = selectedOption.value, // Der Name der Karte in der Option: cardName = selectedOption.innerHTML, // Die Tabellenzeilen: tableRows = subject.querySelectorAll('tr'); let found = false; // Alle Tabellenzeilen durchsuchen: tableRows.forEach(row => { const // Die Zelle mit der Anzahl: countCell = row.querySelector('.count-cell'), // Die Zelle mit dem Value-Attribut: valueCell = row.querySelector('.value-cell'); // Stimmt das value-Attribut in der Tabelle // mit dem ausgewählten überein? if (valueCell.textContent == cardValue) { // Merken, dass die Karte gefunden wurde: found = true; // Anzahl um 1 erhöhen: countCell.textContent = parseInt(countCell.textContent) + 1; } }); // Wurde die Karte nicht gefunden? if (!found) { // Tabellenzeile mit Anzahl 1 einfügen: subject.insertAdjacentHTML("beforeend", '<tr><td class="value-cell">' + cardValue + '</td><td ><strong>' + cardName + '</strong></td><td class="count-cell">1</td></tr>'); } });[/CODE] Ich habe es ausführlich kommentiert, damit Du es auch verstehst. [CODE=html] <select id="select-card"> <option value="empty" selected disabled>Wähle eine Karte:</option> <option value="F">BLA</option> <option value="A">BLABLA</option> <option value="B">1234</option> <option value="Q">5678</option> </select> <button id="insert-btn">Karte(n)zum Angebot hinzufügen</button> <button id="reset">Reset</button> <div> <p>Angebotsübersicht</p> <table id="producttable"> <thead> <tr> <td>Karte</td> <td>Anzahl</td> </tr> </thead> <tbody id="subject"> </tbody> </table> </div>[/CODE] [/QUOTE]
Zitate
Authentifizierung
Antworten
Programmierung
JavaScript
Text von Option auslesen und darstellen
Oben
Unten