Daten aus Formular ohne Reload mit JQuery verarbeiten, in Hidden-Feld ausgeben

html.de-Forum JavaScript
1

Hallo alle zusammen. Diese Frage ist etwas komplexer und wahrscheinlich denke ich zu kompliziert oder meine jQuery-Kenntnisse sind noch nicht weit genug. Aber wegen dieser Frage habe ich überhaupt erst angefangen, damit zu arbeiten. Daher: Bitte Gnade walten lassen! :slight_smile:

Ich habe eine HTML-Seite, auf der folgendes Formular ist:
[HTML] // GROßES FORM, mit vielen anderen Feldern

[/HTML]

Dieses Formular soll im Hintergrund, ohne Reload, an eine PHP Datei gehen, die folgendes macht (nur rudimentär, da die Zwischenschritte kein Problem sind):
[PHP]<?php
// include von Datenbank, Global etc.
$query_alt = $_POST[‚query_alt‘];
$query_neu = $_POST[‚query_neu‘]

// Daten mit Datenbankinhalten abgleichen
// UserIDs raussuchen

if ($query_alt == ‚‘) {
$query_alt = $query_neu;
} else {
$query_alt = $query_alt.„+“.$query_neu;
}
?>[/PHP]

Doch wie muss jetzt das jQuery (ajax?) dafür aussehen? Bisher hab ich:

[CODE][/CODE]

Doch hier komme ich nicht weiter. Daher wäre meine Frage:

    1. Wie bekomme ich die Daten in die PHP-Datei?
    1. Wie bekomme ich sie später im DIV ausgeben und vor allem in die Value des hidden-Inputs?

Ich danke schon einmal für eure Anregung. Sollte jemand einen passenden Link zum Lernen haben, nehme ich das auch sehr gerne :slight_smile:

Vielen Dank!
Windkind

2

Nun zuerst würde ich mal Behaupten das man Formular-Elemente nicht verschachteln darf…

Die Dokumentation zur ajax Methode von jQuery findest du hier https://api.jquery.com/jquery.ajax/

Hier mal ein möglicher Code (nicht getestet):

[code]$(„#mitspieler“).submit(function(event) {

// Die Variable element mit dem Formular-Element belegen
var element = $(this);

// Das Absenden des Forumulars durch den Browser verhindern
event.preventDefault();

// Die Variable url mit der URL des Action-Attributes des Formular belegen
var url = element.attr("action");
// Die Variable daten mit den Daten des Formulars befüllen
var daten = element.serialize();

// Den Request Asyncron über jQuery an das PHP-Schript senden und die Antwort verarbeiten
$.ajax({
    type: "POST",
    url: url,
    data: daten,
    // Bei erforgreicher Ausführung den Response in den output-Container schreiben
    success: function (data) {
        $("#output").html(data);
    },
    // Bei fehlerhafter Ausführung einen Fehler ausgeben
    error: function () {
        $("#output").html("Es ist ein Fehler aufgetreten!")
    }
});

});[/code]

Um das Hidden-Field zu befüllen genauso wie oben mit dem output-Container vorgehen jedoch mit der.val() Methode:

$("#query_alt").val(data)

Weiß jedoch nicht wie und was dein PHP-Script zurückliefert…

Beschreibe doch nochmal was du genau vorhast das mit dem verketten der Suchanfragen verstehe ich nicht so ganz.

3

Hallo,

wow, dankeschön! Wenn ich nachher Zuhause am Rechner bin, werde ich es mal ausprobieren.

Mit dem Verketten:
Es geht um die Auswahl mehrerer User. Es ist in einem Forum, wo ja schon der bekannt ist, der das postet. Nun sollen bei Threaderstellung auch noch andere Personen, an die sich die Diskussion richtet, direkt verlinkt werden.

Zu diesem Zweck gibt es das Feld, wo man den Namen des Users eingeben kann. Der User klickt dann auf den Button. Im PHP wird zu diesem Namen die UserID aus der Datenbank geholt.
Einerseits wird danach der Name im Div-Container ausgegeben, damit der User eine Übersicht hat, andererseits eben die UserID im Hiddenfeld mit + Verkettet und im PHP, das beim Abschicken des kompletten an dieser Stelle auseinander genommen und eine Nachricht an die betreffenden User geschickt und sie in die Datenbank mit eingetragen…

Vielleicht wird es auf meiner Zeichnung ein wenig deutlicher. Ich hoffe, die Beschreibung hilft dir sonst soweit? Hast du sonst vielleicht eine einfachere Idee?

Danke schon einmal! :slight_smile:

4

Mir würden jetzt spontan zwei Möglichkeiten einfallen das anders zu Lösen:

Entweder du speicherst die ausgewählten User in der PHP-Session, musst dann jedoch beim entfernen eines Users nochmal einen Request an den Server senden damit er die Daten aktualisieren kann…

Oder du legst dir für jeden User ein Input-Feld an, diese kannst du als Array befüllen wenn du allen den selben Name-Attribut gibst und ein anhängst.
Das kannst du auch recht einfach über jQuery erreichen.

Beispiel:
[html]
[/html]

5

Danke dir. Ich werde mal schauen, ob ich das hinbekomme :slight_smile: