Question

我将要使用过程PHP和AJAX创建一个便笺系统，这将使我既可以显示新便笺而不刷新，又可以加载更多便笺而不刷新。

在我目前的情况下，两者都有效，但不能同时起作用。如果数据库中没有要显示的注释，那么我的站点将显示一条文字“没有要显示的注释”。如果然后我做一个笔记，它仍然不会显示该笔记，直到我通过单击“加载笔记”按钮将其加载进来。

我尝试在成功功能中添加以下内容：

if(res.indexOf("success")!=-1) {
    location.reload(true);
}

没有运气，即使我在互联网上也能读到，它以某种方式对其他人有用。

这是我的ajax函数：

$(document).ready(function() {
            var noteCount = 2;
            $("#loadMore").click(function() {
                noteCount = noteCount + 2;
                $("#notes").load("load-notes.php", {
                    noteNewCount: noteCount
                });
            });

            $("#noteform").on("submit", function(event) {
                event.preventDefault();
                noteCount = noteCount + 1;
                var form_data = $(this).serialize();
                $.ajax({
                    url: "add-notes.php",
                    method: "POST",
                    noteNewCount: noteCount,
                    data: form_data,
                    dataType: "JSON",
                    success: function(data) {
                        if(res.indexOf("success")!=-1) {
                            location.reload(true);
                        }
                    }
                });
            });
        });

我的add-notes.php

<?php
session_start();
require_once "../inc/core/config.php";

if ($_SERVER['REQUEST_METHOD'] != 'POST') exit;

$subject = mysqli_real_escape_string($dbconn, $_POST['subject']);
$note    = mysqli_real_escape_string($dbconn, $_POST['note']);
$my_date = date("Y-m-d H:i:s");
$author  = $_SESSION['u_firstname'];
$noteNewCount = $_POST['noteNewCount'];

$sql = "INSERT INTO notes(author, subject, note, created_at) VALUES ('$author', '$subject', '$note', '$my_date')";
mysqli_query($dbconn, $sql);

$sql = "SELECT * FROM notes LIMIT $noteNewCount";
$result = mysqli_query($dbconn, $sql);
if (mysqli_num_rows($result) > 0) {

    while ($row = mysqli_fetch_assoc($result)) {
        echo '<div class="note">
            <div class="noteHead">
                <div class="row">
                    <div class="col-md-8">
                        <h3>' . $row["subject"] . '</h3>
                    </div>
                    <div class="col-md-4">
                        <p class="text-muted">Note created by ' . $row["author"] . '</p>
                    </div>
                </div>
            </div>
            <div class="noteContent">
                <div class="row">
                    <div class="col-12">
                        <p>' . $row["note"] . '</p>
                    </div>
                </div>
            </div>
            <div class="noteFooter">
                <div class="row">
                    <div class="col-12">
                        <p class="text-muted">Created ' . $row["created_at"] . '</p>
                    </div>
                </div>
            </div>
        </div>';
    }
} else {
    echo "No comments yet...";
}

显示我的笔记的笔记div及其创建的形式：

<form id="noteform" action="add-notes.php" method="POST" >
            <div class="form-group">
                <label for="usr">Titel:</label>
                <input type="text" class="form-control" name="subject">
            </div>
            <div class="form-group">
                <label for="pwd">Note:</label>
                <textarea class="form-control" rows="5" name="note"></textarea>
            </div>
            <button class="btn btn-outline-success my-2 my-sm-0" name="submit" type="submit">Opret note</button>
        </form>


<div id="notes">
  <?php
  $sql = "SELECT * FROM notes LIMIT 2";
  $result = mysqli_query($dbconn, $sql);
  if (mysqli_num_rows($result) > 0) {
    while ($row = mysqli_fetch_assoc($result)) {

      echo '<div class="note">
      <div class="noteHead">
        <div class="row">
          <div class="col-md-8">
            <h3>' . $row["subject"] . '</h3>
          </div>
          <div class="col-md-4">
            <p class="text-muted">Note created by ' . $row["author"] . '</p>
          </div>
        </div>
      </div>
      <div class="noteContent">
        <div class="row">
          <div class="col-12">
            <p>' . $row["note"] . '</p>
          </div>
        </div>
      </div>
      <div class="noteFooter">
        <div class="row">
          <div class="col-12">
            <p class="text-muted">Created ' . $row["created_at"] . '</p>
          </div>
        </div>
      </div>
    </div>';
    }
  } else {
    echo "No comments yet...";
  }
  ?>
</div>

总而言之，我正在寻找一种显示新笔记的方法，而不必通过我的加载按钮将其加载。我该怎么办？

Answer 1

您可以代替location.reload中的HTML来代替#notes。另外，在add-notes.php中，您正在回显HTML，但是在ajax中，您期望的是dataType: json。另外，不确定noteNewCount是什么传递给AJAX。

                $.ajax({
                    url: "add-notes.php",
                    method: "POST",
                    data: form_data,
                    success: function(data) {
                          $("#notes").html(data);
                    }
                });

另一个AJAX功能成功后，我可以自动运行AJAX功能吗？

1 个答案: