Wie sende ich Ajax-Formulare mit der $.load()-Methode von jQuery und verhindere das Neuladen von Seiten?

Ajax-Formularübermittlung mit $.load()

jQuerys $.load()-Methode ermöglicht es Ihnen Laden Sie externen Inhalt in ein bestimmtes Element, ohne die gesamte Seite neu zu laden. Beim Laden eines Formulars mit $.load() kann es jedoch zu Problemen kommen, da Formularübermittlungen nicht ordnungsgemäß funktionieren.

$.load() und Ajax-Formularübermittlung

Standardmäßig werden mit $.load() geladene Formulare nicht automatisch über Ajax übermittelt. Um die Übermittlung von Ajax-Formularen zu aktivieren, müssen Sie die Option „data“ in der Methode $.load() verwenden. Mit der Option „Daten“ können Sie beim Laden des Formulars Parameter an das serverseitige Skript übergeben.

Beispiel:

<br>$('#CenterPiece').load(Readthis, {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">TestVar: htmlencode(TestVar)

Nach dem Login kopieren

});

In diesem Beispiel wird der Parameter „TestVar“ an „MonsterRequest.php“ übergeben, wenn die Formular wird geladen. Das serverseitige Skript (MonsterRequest.php) kann über $_POST['TestVar'] auf diesen Parameter zugreifen.

Neuladen der Seite vermeiden

Um zu verhindern, dass die Seite beim Absenden des Formulars neu geladen wird, verwenden Sie die Methode „event.preventDefault()“ innerhalb des Submit-Ereignisses handler.

Beispiel:

<br>$('form'). send(Funktion(Ereignis) {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">event.preventDefault();
$.ajax({
    type: "POST",
    url: "MonsterRequest.php",
    data: $(this).serialize(),
    success: function(data) {
        // Process server response
    }
});

Nach dem Login kopieren