• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Daten aus Javascript an PHP übergeben

Capa

Neues Mitglied
Hallo an alle,

ich möchte euch um Unterstützung bei folgendem Vorhaben bitten.

Ziel: Durch Mausklick in ein Feld soll der Buchstabe T in das Feldgeschrieben werden.
Danach sollen die Koordinaten des Klicks an php übermittelt werden um sie in eine
Datenbank zu schreiben. Durch jeden Klick in das Feld wird ein neues T erzeugt.
Ich möchte jedes T in dem Feld sehen und in der Datenbank speichern.

Sowohl Datenbank als auch Tabelle sind angelegt. Ich scheitere leider an der Übergabe
der Koordinaten.

Hier mein Minimalbeispiel:
HTML:
<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset = "utf-8" />
    <title> Klickbox </title>
    <h1 id="titel"> Klickbox </h1>
    <style>
    #feld{
    position: relative;
        top: 100px;
        left: 200px;
        width: 200px;
          height: 100px;
        background-color: #d3d3d3;
    }
    </style>
    <script src="https://code.jquery.com/jquery-2.1.0.js"></script>
    <div id="feld" onclick="klick(event)" ></div>
</head>

<body>
    <script>
    function klick(e){
        var div = document.createElement("DIV");
        var t = document.createTextNode("T");
       
        div.style.position="absolute";
        div.style.left = e.offsetX + "px";
        div.style.top = e.offsetY + "px";
            div.appendChild(t);
        document.getElementById("feld").appendChild(div);
        console.log(e.offsetX, e.offsetY)       
    }
    </script>

    <?php
        $con = mysqli_connect("", "root");
        mysqli_select_db($con, "klickbox");
   
        mysqli_close($con);
    ?>
</body>
</html>

Grüße & Danke Capa
 
Werbung:
Vielen Dank für Deine Antwort.
Die beiden Seiten hatte ich bereits gefunden. Leider komme ich damit nicht voran.
Daher habe ich mich auch an dieses Forum gewendet.
 
Werbung:
Vielen Dank auch Dir für die Links.
Leider ist mir auch mit weiteren Links nicht geholfen.

Mir ist durchaus bewusst, dass mir der Schritt vor dem Datenbankeintrag fehlt. Genau aus
diesem Grund suche ich nun hier um Rat (keine Links). Bevor ich den Eintrag hier gestellt,
habe ich lange im Web recherchiert.

Ist jemand hier, der mir helfen kann?
 
Die Links oben zeigen genau das was Du suchst: du musst per AJAX die von JavaScript ermittelten Daten an den Server übergeben. Dort nimmt eine PHP-Datei die Daten entgegen und speichert sie.

Wenn Du weiterhin damit ein Verständnisproblem hast, beschreib doch mal genauer was Du momentan zu dem Vorgang weißt. Dann könnte man erkennen wo dein gedankliches Problem ist.
 
Werbung:
Die Links oben zeigen genau das was Du suchst: du musst per AJAX die von JavaScript ermittelten Daten an den Server übergeben. Dort nimmt eine PHP-Datei die Daten entgegen und speichert sie.

Wenn Du weiterhin damit ein Verständnisproblem hast, beschreib doch mal genauer was Du momentan zu dem Vorgang weißt. Dann könnte man erkennen wo dein gedankliches Problem ist.
Dem ist nichts hinzuzufügen :cool:
 
Keines der beiden Beispiele in den Links ist mit dem angegebenen Quellcode lauffähig.
Aus diesem Grund habe ich ein Minimalbeispiel mitgeliefert.
 
Natürlich gibt es für deinen Wunsch keine fertige Lösung. Du musst schon den Quellcode an das anpassen was Du benötigst. Das wichtigste an dem von dir zu erstellenden Code ist eigentlich der auslösende AJAX-Request. Da Du bereits jquery eingebunden hast, sollte es nicht schwer sein anhand der dokumentierten jquery-AJAX-Request-Beispiele hier

http://api.jquery.com/jquery.ajax/

einen Code zu bauen der deinen Wunsch erfüllt.

Wenn Du dagegen erhoffst, dass dir hier jemand einen fertigen Code für deinen Wunsch schreibt, dann solltest Du dich an die Jobbörse wenden.
 
Werbung:
Wenn ich mit dem Link zurecht kommen würde, hätte ich kein Problem.
Ich habe hier nicht nach Hilfe gefragt um Links als Antwort zubekommen, die ich im Web selbst finde.

Eigenartige Form der Hilfe.
Die Moderatoren können das Thema gern schließen und löschen.
 
Wobei die Links alleine nicht weiterhelfen.

Leicht modifiziert entspricht die Frage des TE einer ToDo-List. Man hat zu Beginn ein einzelnes Input-Feld und bei jedem Enter oder Click auf einen Button wird ein weiteres erzeugt. Im Ergebnis erhält man eine Anzahl von Values, die erst in ein Array gepushed werden sollten, bevor dieses per AJAX weitergereicht wird.
 
Werbung:
function resetLock(send) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("output").innerHTML = this.responseText;
}
};
xhttp.open("POST", "reset.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("resetset="+send);
}


ich denke das das weiterhelfen könnte
in der letzten Zeile wo resetset steht ist die variable die du in php als $_POST bekommst und das send da stehen die daten drinn was du haben willst von javascript

ich hoffe das hilft jemanden denn ich habe auch tagelang danach gesucht und wollte halt kein jequery benutzen und siehe da es geht auch ohne aber warum mir das kaum einer verraten wollte ist mir ein rätsel
 
Zurück
Oben