AJAX Inhalte mehrerer Eingabefelder in Ausgabefeld aktualisieren

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • AJAX Inhalte mehrerer Eingabefelder in Ausgabefeld aktualisieren

    Guten Morgen zusammen

    Erstmal ein Lob an dieses Forum, hat mir schon bei einigen Problemen weitergeholfen.
    Nun hab ich aber ein Problem, dass mich irgendwie um den Schlaf bringt. Wahrscheinlich hab ich einfach nur ein Brett vorm Kopf.

    Ich schreibe momentan an einem Konfigurationstool, mit dem man durch Eingabe ein Produkt herauskristallisieren kann. Das ganze ist mit PHP umgesetzt und funktioniert recht gut. Jetzt möchte ich aber gerne das die Daten bei Eingabe berücksichtigt werden, wie bei einer normalen Desktopanwendung. Für ein Feld bekomme ich das ganze auch hin. Jetzt verstehe ich nur nicht ganz wie ich alle Eingabefelder berücksichtigen kann. Ich bin leider kein Javascript experte, deshalb hoffe ich das ihr mich für diese Frage nicht auslachtJ

    Hier mal mein Ajax Code:


    Quellcode

    1. function sendRequest() {
    2. try {
    3. req = window.XMLHttpRequest?new XMLHttpRequest():
    4. new ActiveXObject("Microsoft.XMLHTTP");
    5. } catch (e) {
    6. //Kein AJAX Support
    7. }
    9. req.onreadystatechange = handleResponse;
    10. id = document.getElementById('medium').value;
    11. req.open('get', 'func.php?s='+ id);
    12. req.send(null);
    15. req.onreadystatechange = handleResponse;
    16. id = document.getElementById('flanschart').value;
    17. req.open('get', 'func.php?flanschart='+ id);
    18. req.send(null);
    19. }
    21. function handleResponse() {
    22. if ((req.readyState == 4) && (req.status == 200)) {
    23. document.getElementById('auswahl').innerHTML = req.responseText;
    24. }
    25. }
    Alles anzeigen


    Hier mal mein Code für das eine Eingabefeld:

    Quellcode

    1. <select id="medium" name="fm-state" onChange="sendRequest()">
    2. <option value="" selected="selected">Medium w&auml;hlen</option>
    3. <option value="">Medien</option>
    4. </select>


    Ich habe noch mal ein Bild der Anwendung eingefügt, vielleicht hilft das ein wenig um zu verstehen was ich gerne umsetzen möchte. In dem weißen Feld rechts sollen dann die Produkte angezeigt werden. Würde mich freuen wenn mir jemand von euch helfen könnte. Schönen Gruß Micha

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von nky ()

  • Hi, das sieht nach einer schicken Anwendung aus ;)
    Was genau hast du denn mit den 2 Requests vor, die von einem Handler abgearbeitet werden sollen?
    Einer sollte doch reichen.

    Quellcode

    1. [...]
    2. id = document.getElementById('medium').value;
    3. req.open('get', 'func.php?s='+ id);
    5. [...]
    6. id = document.getElementById('flanschart').value;
    7. req.open('get', 'func.php?flanschart='+ id);

  • Hallöchen

    Danke für die schnelle Antwort.
    Die Anwendung soll mal schön werden, wenn alles hinhaut ;)

    Ich glaube der zweite request ist ein übrigbleibsel meines verzweifelten Versuchs die Daten aus unterschiedlichen Feldern auf die func.php zu bekommen.
    Das hat allerdings nicht so wirklich geklappt. Ist es denn möglich die Daten aus allen Feldern nur über

    Quellcode

    1. id = document.getElementById('medium').value;
    2. req.open('get', 'func.php?s='+ id);


    zur func.php zu übertragen? Also zusätzlich zum Medium auch noch die beiden input Felder und die Checkboxen?
    Wie gesagt, ich bin leider nicht die leuchte wenns um JS geht. 8|

    Gruß

    Micha

  • als das Senden mehrerer Daten an die func.php stellt ja kein Problem dar:

    Quellcode

    1. id1 = document.getElementById('medium').value;
    2. id2 = document.getElementById('flanschart').value;
    3. req.open('get', 'func.php?s='+ id +'flanschart='+ id);


    ... und so wie ich das verstanden habe, willst du die Rückgabe auch nicht weiter auf mehrere Felder aufteilen, oder?

  • Hallo

    Also die Daten aus den Feldern gebe ich weiter an eine Datenbankabfrage.
    Diese gibt mir dann Daten zurück die im weissen Fenster in der Anwendung angezeigt werden.
    Wie meinst du das denn mit Rückgabe auf mehrere Felder aufteilen?

    Ich habe das Script jetzt mal abgeändert, aber irgendwie funktioniert das noch nicht so wie gewünscht.
    Muss ich jetzt in jedes inputfeld ein

    Quellcode

    1. onChange="sendRequest()"


    einfügen in der die id steht oder wie spreche ich die funktion an?
    Kann man nicht einfach nach jeder Änderung im Formular die func.php aufrufen und aktualisieren?

    Steh da grad irgendwie auf dem Schlauch :pinch:

  • nky schrieb:

    Kann man nicht einfach nach jeder Änderung im Formular die func.php aufrufen und aktualisieren?

    ja, wenn du nach jeder Änderung ein Neuladen willst, musst du in jedes einzelne Formularelement (input, select, textarea) die onchange Funktion aufrufen.

    Wie im letzten Posting baust du dir dann eine lange GET Anfrage (POST wäre eigentlich besser) zusammen:

    Quellcode

    1. req.open('get', 'func.php?s='+ id +'flanschart='+ id);