Wie baut man ein Ajax-Kommentarsystem?

Question

Ich möchte eine Weile mit jQuery und Ajax herumspielen.

Für meine erste möchte ich nur ein einziges Eingabefeld erstellen, in das ich meinen Kommentar eintippe, der dann unten erscheint. Die Seite wird nicht aktualisiert. Wie kann ich dies tun?

Answer 1

Die Grundidee ist, dass Sie eine clientseitige Seite mit einer Textarea oder einem Eingabefeld haben. Hängen Sie einen .click an eine Submit-Schaltfläche an und der .click ruft über .ajax ein serverseitiges Skript auf.

Client-Seite:

<script type="text/javascript">
    $(document).ready(
    $('#submit').click({
       $.ajax({
                 type=POST,
                 data: "comment="+$("#comments").val(),
                 dataType: json,
                 url: 'somePage.php',
                 success: function(data) {
                     if(data.error){
                         alert("server reported error"); 
                     }else{

                         $('#postedComments').append(data);
                     }
                 }
               });

    });

});
</script>
<div id="postedComments></div>
<textarea id="comments"></textarea>
<input type="submit" id="submit" value="Post Comment" />

Server-Seite:

<?php
   if(isset($_POST['comments'])){
        //perform Database insert of value $_POST['comments']
        if(<database error>){
            echo json_encode(array('error'=>'-1'));
        }else{
            echo json_encode(array('success'=>'1'));
        }
   }
?>

Wenn der Kunde auf "Submit" klickt, sendet .ajax "Kommentare" an das serverseitige Skript. Das Skript dann prozessiert Anfrage und Berichte zurück in Json-Codierung Fehler oder Erfolg, die ist, wie in den Erfolg der Ajax-Aufruf können Sie bestimmen, was mit dem Server-Aufruf passiert. Erfolg in der Ajax ist nicht Erfolg es lediglich anzeigt, dass der Server zurück geantwortet, weshalb Sie einige Nachricht codieren können, um zurück zu Client-Skript zu senden, um festzustellen, ob der Server mit Fehler oder Erfolg Nachricht geantwortet.

Answer 2

Sie sollten Beitrag den Inhalt des Eingabefeldes an den Server und anhängen. in die Kommentare ein, sobald die Erfolgsmeldung vom Server eintrifft.

Answer 3

Ich habe ein jQuery angetriebenes Ajax-Kommentarsystem ähnlich dem von Wordpress gebaut. Die erstellen/löschen Aktionen sind alle Ajax angetrieben.

Ich habe es getan, indem ich manuell $.post() Operationen für das Erstellen von Kommentaren und $.get() für das Löschen von Kommentaren durchgeführt habe.