[ad_1]
Demo
In diesem Artikel erfahren Sie, wie Sie eine Funktion für Kommentare und Antworten auf Ihrer Website implementieren können. Wenn Sie ein Blog betreiben oder ein Portfolio oder eine Ticketbuchungswebsite haben, wird die Liste fortgesetzt. Sie möchten die Möglichkeit haben, die Meinungen, Bewertungen und Vorschläge Ihrer Benutzer zu sammeln. Zum Beispiel lade ich pädagogische Inhalte im Zusammenhang mit Computerprogrammierung hoch. Ich möchte wissen, ob meine Benutzer meinen Artikeln folgen, ob sie sie gut verstehen, welche Artikel schwer zu verstehen sind, welche gut sind, welche verbessert werden können usw.
Wir werden eine Tabelle erstellen, die alle Kommentare eines Beitrags enthalten kann, ein Beitrag kann alles sein, Blog-Beitrag / Produkt / Film / Berühmtheit usw. Es wird eine einzige Tabelle geben, in der die Kommentare sowie die Antworten der einzelnen Kommentare gespeichert werden können . Der Benutzer kann einem Beitrag einen Kommentar hinzufügen und auch auf einen Kommentar antworten. Wenn Sie eine Antwort auf einen Kommentar hinzufügen, wird auch eine E-Mail an den Peron gesendet, auf den Sie geantwortet haben.
Führen Sie die folgende Abfrage in Ihrem phpMyAdmin in Ihrer Datenbank aus, um eine Tabelle mit dem Namen „Bemerkungen“:
CREATE TABLE IF NOT EXISTS comments (
id INTEGER NOT NULL PRIMARY KEY AUTO_INCREMENT,
name TEXT NOT NULL,
email TEXT NOT NULL,
comment TEXT NOT NULL,
post_id INTEGER NOT NULL,
created_at DATETIME NOT NULL,
reply_of INTEGER NOT NULL,
CONSTRAINT fk_comments_post_id FOREIGN KEY (post_id) REFERENCES posts(id)
)
Dadurch wird eine Tabelle mit dem Namen „Kommentare“ in Ihrer Datenbank erstellt, falls diese nicht vorhanden ist. Es wird eine eindeutige ID, einen Namen, eine E-Mail-Adresse und einen Kommentar haben. post_id wird die ID des Beitrags sein, in dem ein Kommentar hinzugefügt wird, da der Benutzer jeden Beitrag kommentieren kann. hergestellt in ist das Datum und die Uhrzeit, zu der der Kommentar hinzugefügt wird. reply_of ist der Wert des Kommentars, auf den der Benutzer geantwortet hat. Wenn Sie einen Kommentar direkt zum Beitrag hinzufügen, ist der Wert 0, wenn Sie eine Antwort zu einem Kommentar hinzufügen, ist der Wert die ID des Kommentars, auf den Sie antworten. Aus diesem Grund wird es nicht als Fremdschlüssel hinzugefügt, da sein Wert null sein kann. Schließlich fügen wir ein Unbekannter Schlüssel Einschränkung für unser Feld post_id, da dies die ID des Beitrags ist, dem ein Kommentar hinzugefügt wird.
Unser Kommentarformular enthält Namen, E-Mail-Adresse, Kommentar, ein verstecktes Feld für die Post-ID und eine Schaltfläche zum Senden. Sie können dies gemäß dem Farbschema Ihrer Website gestalten. Das versteckte Eingabefeld ist die eindeutige Post-ID. Geben Sie Ihre dynamische Post-ID ein $ post_id Variable.
<form action="index.php" method="post">
<input type="hidden" name="post_id" value="<?php echo $post_id; ?>" required>
<p>
<label>Your name</label>
<input type="text" name="name" required>
</p>
<p>
<label>Your email address</label>
<input type="email" name="email" required>
</p>
<p>
<label>Comment</label>
<textarea name="comment" required></textarea>
</p>
<p>
<input type="submit" value="Add Comment" name="post_comment">
</p>
</form>
Die Formularmethode ist POST. Die Aktion ist der Name der Datei, an die die Daten zur Verarbeitung gesendet werden. Wir senden an index.php, aber Sie können den Namen der Datei nach Bedarf ändern. Dann erstellen wir alle Felder, stellen Sie sicher, dass Sie geben Name Attribut für alle Felder einschließlich der Schaltfläche „Senden“. Dies hilft dem Server zu überprüfen, ob die Anforderung aus einem bestimmten Formular stammt, und die Werte aus diesen Eingabefeldern abzurufen.
Der folgende Code überprüft, ob das Formular gesendet wurde, überprüft alle Felder aus der SQL-Injection und speichert sie in der Datenbank.
<?php
// index.php
$conn = mysqli_connect("localhost:8889", "root", "root", "yourdbname");
if (isset($_POST["post_comment"]))
{
$name = mysqli_real_escape_string($conn, $_POST["name"]);
$email = mysqli_real_escape_string($conn, $_POST["email"]);
$comment = mysqli_real_escape_string($conn, $_POST["comment"]);
$post_id = mysqli_real_escape_string($conn, $_POST["post_id"]);
$reply_of = 0;
mysqli_query($conn, "INSERT INTO comments(name, email, comment, post_id, created_at, reply_of) VALUES ('" . $name . "', '" . $email . "', '" . $comment . "', '" . $post_id . "', NOW(), '" . $reply_of . "')");
echo "<p>Comment has been posted.</p>";
}
?>
Zuerst verbinden wir uns mit der Datenbank. Sie können den Benutzer, das Passwort und den Datenbanknamen gemäß Ihrem Projekt ändern. Dann prüfen wir, ob die Anfrage über das Formular zum Hinzufügen eines Kommentars erfolgt. Dann validieren wir alle Felder, um eine SQL-Injection mit integriertem PHP zu verhindern mysqli_real_escape_string Funktion. Wir setzen die reply_of Wert auf 0, da dieses Feld, wie bereits erwähnt, den Wert 0 hat, wenn der Kommentar direkt zum Beitrag hinzugefügt wird. Der Wert ist nur für Antworten größer als Null.
Dann führen wir die Abfrage aus, um die Daten in die Kommentartabelle einzufügen. Zum Einstellen des Wertes in hergestellt in Feld verwenden wir MySQL eingebaut JETZT() Funktion. Dies gibt das aktuelle Datum und die aktuelle Uhrzeit im richtigen Format zurück. Ymd H: i: s. Schließlich wird eine Erfolgsmeldung angezeigt, dass der Kommentar veröffentlicht wurde.
Jetzt müssen wir alle Kommentare aus der Datenbank in folgendem Format abrufen:
[
{
"id": 1,
"name": "ali ahmad",
"email": "[email protected]",
"comment": "nice post",
"post_id": 3,
"created_at": "2020-09-16 20:09:44",
"reply_of": 0,
"replies": [
{
"id": 2,
"name": "ali ahmad",
"email": "[email protected]",
"comment": "thanks",
"created_at": "2020-09-16 20:09:44",
"post_id": 3,
"reply_of": 1
}
]
}
]
Achten Sie genau auf dieses Format. Wir haben eine Reihe von Kommentaren, jedes Objekt hat eine eindeutige ID, einen eindeutigen Namen, eine eindeutige E-Mail-Adresse, einen eindeutigen Kommentar, eine post_id, einen erstellten_at, eine Antwort_von und Antworten. Wenn Sie nun das Array „Antworten“ untersuchen, werden Sie feststellen, dass es mit Ausnahme des Antwortarrays dasselbe Objekt wie die Kommentare hat. Das reply_of Der Wert im Antwortarray entspricht der ID des Kommentars. Sie werden es besser verstehen, wenn wir die Antwortfunktion abgeschlossen haben.
Der folgende Code generiert die Datenstruktur wie oben. Sie können diesen Code dort platzieren, wo Sie alle Kommentare eines Beitrags anzeigen möchten:
<?php
// connect with database
$conn = mysqli_connect("localhost:8889", "root", "root", "tutorials");
// get all comments of post
$result = mysqli_query($conn, "SELECT * FROM comments WHERE post_id = 3");
// save all records from database in an array
$comments = array();
while ($row = mysqli_fetch_object($result))
{
array_push($comments, $row);
}
// loop through each comment
foreach ($comments as $comment_key => $comment)
{
// initialize replies array for each comment
$replies = array();
// check if it is a comment to post, not a reply to comment
if ($comment->reply_of == 0)
{
// loop through all comments again
foreach ($comments as $reply_key => $reply)
{
// check if comment is a reply
if ($reply->reply_of == $comment->id)
{
// add in replies array
array_push($replies, $reply);
// remove from comments array
unset($comments[$reply_key]);
}
}
}
// assign replies to comments object
$comment->replies = $replies;
}
?>
Vergessen Sie nicht, die post_id in der SQL-Abfrage zu ersetzen. Der Rest des Codes ist selbsterklärend. Wenn Sie den folgenden Befehl nach der obersten foreach-Schleife schreiben, wird dieselbe Datenstruktur wie oben angezeigt:
print_r($comments);Aber im Moment ist das Antwort-Array leer, da wir gerade einen Kommentar zu einem Beitrag hinzugefügt haben, aber keine Antwort auf einen Kommentar hinzugefügt haben. Es ist Zeit, all diese Kommentare anzuzeigen. Auch hier können Sie nach Ihren Wünschen gestalten. Der Einfachheit halber erstellen wir jedoch ein grundlegendes Layout.
<ul class="comments">
<?php foreach ($comments as $comment): ?>
<li>
<p>
<?php echo $comment->name; ?>
</p>
<p>
<?php echo $comment->comment; ?>
</p>
<p>
<?php echo date("F d, Y h:i a", strtotime($comment->created_at)); ?>
</p>
<div data-id="<?php echo $comment->id; ?>" onclick="showReplyForm(this);">Reply</div>
<form action="index.php" method="post" id="form-<?php echo $comment->id; ?>" style="display: none;">
<input type="hidden" name="reply_of" value="<?php echo $comment->id; ?>" required>
<input type="hidden" name="post_id" value="3" required>
<p>
<label>Your name</label>
<input type="text" name="name" required>
</p>
<p>
<label>Your email address</label>
<input type="email" name="email" required>
</p>
<p>
<label>Comment</label>
<textarea name="comment" required></textarea>
</p>
<p>
<input type="submit" value="Reply" name="do_reply">
</p>
</form>
</li>
<?php endforeach; ?>
</ul>
Dadurch werden alle Kommentare in einer nicht geordneten Liste so angezeigt, dass Sie den Namen und den Kommentar der Person, das Datum und die Uhrzeit der Veröffentlichung des Kommentars sowie eine Schaltfläche zum Antworten sehen können. Sie sehen, dass wir auch ein Formular-Tag erstellt haben, es jedoch sofort mithilfe des CSS-Stilattributs ausblenden. Dieses Formular ist nur sichtbar, wenn Sie auf die Schaltfläche „Antworten“ klicken. Sie können sehen, dass die Antwortschaltfläche eine hat Daten-ID Das Attribut, das den Wert der Kommentar-ID hat, entspricht dem ID-Attribut der Form. Dies hilft uns, das Formular nur für diesen Kommentar anzuzeigen.
Das Formular enthält 2 versteckte Eingabefelder. reply_of bedeutet die ID des Kommentars, auf den ich antworte, und der zweite ist die Post-ID. Andere Felder sind dieselben wie im vorherigen Kommentarformular (Name, E-Mail, Kommentar). Stellen Sie sicher, dass Ihre Antwortschaltfläche im Formular ein anderes Namensattribut aufweist als das Formular des Kommentars aus dem vorherigen Abschnitt. Zum Beispiel hatten wir vorher gegeben name = ”post_comment” aber im Falle einer Antwort setzen wir name = „do_reply“. Dies hilft uns, einen separaten Code für Kommentare und Antworten auszuführen, da wir im Falle einer Antwort eine E-Mail an den Kommentator senden müssen, damit er weiß, dass jemand auf seinen Kommentar geantwortet hat.
Im vorherigen Abschnitt können Sie sehen, dass wir eine hinzugefügt haben onclick Ereignis-Listener auf die Antwortschaltfläche. Jetzt müssen wir seine Funktion in Javascript erstellen:
<script>
function showReplyForm(self) {
var commentId = self.getAttribute("data-id");
if (document.getElementById("form-" + commentId).style.display == "") {
document.getElementById("form-" + commentId).style.display = "none";
} else {
document.getElementById("form-" + commentId).style.display = "";
}
}
</script>
Zuerst erhält es die Kommentar-ID mit Daten-ID Attribut der Antwortschaltfläche. Dann wird geprüft, ob das Formular sichtbar ist. Wenn es sichtbar ist, wird das Formular ausgeblendet und wenn es ausgeblendet wird, wird es sichtbar. Dies funktioniert wie ein Umschalter.
Jetzt wird das Formular angezeigt, Zeit, es zu verarbeiten. Wenn das Antwortformular gesendet wird, speichern wir den Datensatz in der Datenbank, wie wir es mit normalen Kommentaren tun, aber wir werden ihn festlegen reply_of Wert auf die ID des Kommentars. Darüber hinaus senden wir ein eamil an die Person, auf die Sie antworten.
<?php
if (isset($_POST["do_reply"]))
{
$name = mysqli_real_escape_string($conn, $_POST["name"]);
$email = mysqli_real_escape_string($conn, $_POST["email"]);
$comment = mysqli_real_escape_string($conn, $_POST["comment"]);
$post_id = mysqli_real_escape_string($conn, $_POST["post_id"]);
$reply_of = mysqli_real_escape_string($conn, $_POST["reply_of"]);
$result = mysqli_query($conn, "SELECT * FROM comments WHERE id = " . $reply_of);
if (mysqli_num_rows($result) > 0)
{
$row = mysqli_fetch_object($result);
// sending email
$headers="From: YourWebsite <[email protected]>" . "rn";
$headers .= 'MIME-Version: 1.0' . "rn";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "rn";
$subject = "Reply on your comment";
$body = "<h1>Reply from:</h1>";
$body .= "<p>Name: " . $name . "</p>";
$body .= "<p>Email: " . $email . "</p>";
$body .= "<p>Reply: " . $comment . "</p>";
mail($row->email, $subject, $body, $headers);
}
mysqli_query($conn, "INSERT INTO comments(name, email, comment, post_id, created_at, reply_of) VALUES ('" . $name . "', '" . $email . "', '" . $comment . "', '" . $post_id . "', NOW(), '" . $reply_of . "')");
echo "<p>Reply has been posted.</p>";
}
?>
Zuerst prüfen wir, ob die empfangene Anfrage zum Hinzufügen einer Antwort dient. Dann schützen wir alle Eingabefelder vor SQL-Injection, einschließlich der ausgeblendeten Felder. Dann erhalten wir die Zeile des Kommentars, die die Antwort hinzufügt. Durch Abrufen der Kommentarzeile aus der Datenbank können wir die E-Mail-Adresse des Kommentators abrufen und so problemlos eine E-Mail mit integriertem PHP senden mail () Funktion. Wenn Sie an localhost arbeiten, funktioniert die Funktion mail () möglicherweise nicht. In diesem Fall verwenden Sie PHPMailer. Eine Bibliothek, mit der Sie E-Mails auch von localhost senden können wie man das benutzt.
Schließlich führen wir die INSERT-Abfrage aus, um den Datensatz in der Datenbank zu speichern. Außerdem wird eine Erfolgsmeldung angezeigt. Jetzt werden Sie sehen, dass Ihre $ Kommentare Array hat auch ein verschachteltes Antwortarray. Zeit, um die Antworten für jeden Kommentar anzuzeigen.
Fügen Sie nach dem Beenden des Formular-Tags in der foreach-Schleife des Arrays $ comment den folgenden Code ein, um alle Antworten anzuzeigen:
<ul class="comments reply">
<?php foreach ($comment->replies as $reply): ?>
<li>
<p>
<?php echo $reply->name; ?>
</p>
<p>
<?php echo $reply->comment; ?>
</p>
<p>
<?php echo date("F d, Y h:i a", strtotime($reply->created_at)); ?>
</p>
<div onclick="showReplyForReplyForm(this);" data-name="<?php echo $reply->name; ?>" data-id="<?php echo $comment->id; ?>"> Reply</div>
</li>
<?php endforeach; ?>
</ul>
Dadurch werden alle Antworten für jeden Kommentar in demselben Format angezeigt, in dem Kommentare der obersten Ebene angezeigt werden. Es wird wieder eine Antwortschaltfläche haben, aber dies wird keine “Antwort einer Antwort„, Weil es unendlich weit gehen könnte und auch im Design nicht gut aussehen wird. Deshalb werden wir wieder ein Formular zeigen und seine Antwort wird in die Liste aufgenommen.
Der Antwortknopf hat Daten-ID und Datenname Attribute, die die ID des Kommentars und den Namen der Person darstellen, auf die Sie antworten. Dies ist nützlich, wenn Sie den Namen der Person mit @ -Zeichen im Feld Antworttextbereich anzeigen möchten.
Sie werden feststellen, dass die Funktion aufgerufen wurde onclick Das Ereignis unterscheidet sich vom vorherigen. Dies liegt daran, dass im Feld für den Antworttextbereich @ sign angezeigt wird. Erstellen Sie die folgende Funktion in Ihrem Javascript:
<script>
function showReplyForReplyForm(self) {
var commentId = self.getAttribute("data-id");
var name = self.getAttribute("data-name");
if (document.getElementById("form-" + commentId).style.display == "") {
document.getElementById("form-" + commentId).style.display = "none";
} else {
document.getElementById("form-" + commentId).style.display = "";
}
document.querySelector("#form-" + commentId + " textarea[name=comment]").value = "@" + name;
document.getElementById("form-" + commentId).scrollIntoView();
}
</script>
Zuerst erhalten wir die Kommentar-ID und den Namen der Person unter Verwendung von Datenattributen. Dann zeigen wir das Formular an, wenn es ausgeblendet ist, und verbergen das Formular, wenn es bereits sichtbar ist. Dann stellen wir das @ -Zeichen in das Textfeldfeld und schreiben den Namen des Kommentators hinein. In der letzten Zeile wird die Seite zum Formular gescrollt. Dies ist hilfreich, da das Formular oben in jedem Kommentar erstellt wird und Sie versuchen, auf eine 1000 zu antwortenth Person dann wird automatisch zum Formular-Tag gescrollt.
[ad_2]