JavaScript Speicherung per AJAX ohne Erfolg

yoyo2435x

Cadet 3rd Year
Registriert
Juli 2021
Beiträge
34
Hallo,

ich versuche gerade ein kleines Tool zu entwickeln - komme aber mit dem JS nicht ganz zurecht.
Ich möchte, dass bei dem Wechsel zwischen Herr und Frau dies entsprechend im Value ausgegeben
wird (der wird zuerst aus der Datenbank abgerufen) und der Wechsel ebenfalls per AJAX in die Daten-
bank geschrieben wird. Funktioniert leider noch nicht so richtig. Vielleicht könnt ihr mir dabei helfen?

Mein HTML:
HTML:
<div class="dropdown">
    <button style="background-color: white; border: none;" class="dropdown-toggle" type="button" id="anrede" data-toggle="dropdown" aria-haspopup="true"
            aria-expanded="true">
        <input type="text" style="text-align: center;" class="bull" value="<?= $anrede ?>" id="label_anrede">
    </button>
    <ul class="dropdown-menu" aria-labelledby="anrede">
        <li value="M" class="ajax_click"><a href="#">Herr</a></li>
        <li value="W" class="ajax_click"><a href="#">Frau</a></li>
    </ul>
</div>

Meine JS-Funktion:
Javascript:
$(document).ready(function()
{
    $(".ajax_click").click(function()
    {
        var ID = $(this).attr('id');
    }).click(function()
    {
        var ID = $(this).attr('id');
        var IID = document.getElementById("iid").value;
        var content = document.getElementById(ID).value;
        var newContent = content.split('&').join('und');
        var dataString = 'id=' + IID + '&field=' + ID + '&value=' + newContent;

        $.ajax({
            type: "POST",
            url: "push.php",
            data: dataString,
            cache: false,
            success: function(html)
            {

            },
            error: function(data)
            {
                alert("Ein Fehler ist aufgetreten - Speicherung nicht erfolgt!");
            }
        });

    });

});

PHP zur Speicherung:
PHP:
$id = $_POST['id'];
$field = $_POST['field'];
$value = htmlspecialchars(strip_tags($_POST['value']),
    ENT_QUOTES | ENT_HTML5, 'UTF-8');

$stmt = $personen->runQuery("UPDATE personen
        SET $field='$value' WHERE id='$id'");
$stmt->execute();

Hat einer eine Idee, woran es liegen könnte? Vermute das Problem im
JS-Part - oder rufe ich vielleicht an falscher Stelle die Funktion auf?
 
Funktioniert nicht ist keine gute Beschreibung.

Wird kein HTTP-Request abgesetzt? Kommen andere Daten an als du erhofft hast? Wirft die Datenbank eine Fehlermeldung?
 
Sorry, hatte gehofft, dass vielleicht jemandem auf Anhieb klar ist, wo der Fehler
liegen könnte. Es kommt nichts im PHP-Script an. Es wird wohl kein HTTP-Re-
quest abgesetzt.
 
Ehrlich gesagt habe ich (und die meisten wohl ebenso) keine Lust den Code zu studieren und gedanklich durchzuspielen in der Hoffnung einen Fehler zu finden, wenn du uns das Problem auch einfach sagen kannst.

Ob ein HTTP-Request abgesetzt wird siehst du, wenn du mit F12 die Entwicklerkonsole im Browser öffnest und auf den Netzwerktab gehst. Dort siehst du dann evtl. sogar direkt eine Fehlermeldung wie 404 o.Ä.
 
  • Gefällt mir
Reaktionen: netzgestaltung und Phrasendreher
Bagbag schrieb:
Ob ein HTTP-Request abgesetzt wird siehst du, wenn du mit F12 die Entwicklerkonsole im Browser öffnest
und auf den Netzwerktab gehst. Dort siehst du dann evtl. sogar direkt eine Fehlermeldung wie 404 o.Ä.

Dann wird kein Request abgesetzt - da passiert nämlich gar nichts in dem Fenster.

Leider kann ich den Fehler nicht genau eingrenzen - dazu reichen meine Kenntnisse in JS leider
noch nicht aus. Ja, ich lerne es noch, würde vor dem großen Lernen dennoch gerne diese
Funktion realisiert bekommen.
 
Dann schau mal noch in der Entwicklerkonsole im Konsolenoutput, ob ein Fehler geworden wird.

Der Klick bezieht sich auf das li-Element, die haben aber keine Id. Sowohl Zeile 9 als auch 10 sollte daher null zurückgeben womit ein Zugriff auf value einen TypeError werfen sollte.
 
  • Gefällt mir
Reaktionen: netzgestaltung
Ich habe dem LI-Element jetzt auch eine ID gegeben.
Mir ist aufgefallen, dass nun im JS-Beispiel der Code in Zeile 5 ausgeführt wird. Der Block zwischen Zeile 7
und 29 wird jedoch nicht aufgerufen. Hab´s mit Konsolen-Ausgaben und einem Alert getestet.
 
Dann erzähl uns doch mal, was du im JS in Zeile 3 und Zeile 6 bezwecken möchtest, mit den beiden click-Handlern.
 
Javascript:
$(".ajax_click").click(function()
    {
        var ID = $(this).attr('id');
    }).click(function()
    {
        var ID = $(this).attr('id');

Das sieht falsch aus. Ich benutze zwar selber kein JQuery (korrekt?) für AJAX, aber kann mir nicht vorstellen, dass diese Verschachtelung i.O. ist.

Versuch einfach mal, die Zeilen 5-7 in Deinem JS-Beispielcode zu entfernen - nur ein Click-Handler sollte doch ausreichen.
 
  • Gefällt mir
Reaktionen: netzgestaltung
Zurück
Oben