添加数据类型：在 Ajax 中"json"不起作用

Question

我正在尝试从我的数据库中检索数据，然后将其显示到模态中，但是，当我在ajax中添加dataType："json"时，它似乎不再执行我的php文件。我是 ajax 和 json 的新手，所以我真的不知道我在哪里遇到问题。顺便说一句，我正在尝试实现 CRUD 功能，这就是我尝试将数据加载到模式中进行更新的原因。我使用相同的模式进行创建和更新。

这是我的 html 代码。

<div class="modal fade" id="addmodal">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <h3>Add Product</h3>
              </div>
              <div class="modal-body">
                <form class="" action="add.php" method="post" id="insert_form" enctype="multipart/form-data">
                    <div class="form-group input-width center-block">
                      <input class="form-control" type="file" name="img" id="img" value="" required/>
                    </div>
                    <div class="form-group input-width center-block">
                      <label>Product Name:</label>
                      <input class="form-control" type="text" name="pnametb" id="pnametb" placeholder="Product Name" required>
                    </div>
                    <div class="form-group input-width center-block">
                      <label>Price:</label>
                      <input class="form-control" type="text" name="pricetb" id="pricetb" placeholder="Price" required>
                    </div>
                    <div class="form-group input-width center-block">
                      <label>Category:</label>
                      <select style="" class="action form-control" name="category" id="category" required>
                      <option value="" disabled selected>Select a category:</option>
                      <?php
                                while($row = mysqli_fetch_assoc($result))
                                {
                                ?>
                                <!-- Separated HTML and PHP -->
                                <option value="<?php echo $row['category']?>"><?php echo $row['category']?></option>
                                <?php
                                }
                                ?>
                    </select>
                    </div>
                    <div class="form-group input-width center-block">
                      <label>Description:</label>
                    </div>
                    <div class="form-group input-width center-block">
                      <textarea style="color:black" name="destb" id="destb" class="message-box" placeholder="Description" rows="5" id="comment" required></textarea>
                    </div>
                    <input type="hidden" name="id" id="id">
                    <input class="btn btn-success" type="submit" name="add" value="Add" id="add">
                </form>
              </div>
              <div class="modal-footer">
                <button class="btn btn-default" type="button" name="button" data-dismiss="modal">Close</button>
              </div>
            </div>
          </div>
        </div>

我的 ajax 代码：

$(document).on('click', '.edit', function(){
       var id = $(this).attr("id");
       alert(id);
       $.ajax({
            url:"fetch.php",
            method:"post",
            data:{id:id},
            dataType: "json",
            success:function(data){
              $('#img').val(data.img);
              $('#pnametb').val(data.productname);
              $('#pricetb').val(data.price);
              $('#category').val(data.category);
              $('#destb').val(data.description);
              $('#id').val(data.id);
              $('#add').val("Edit");
              $('#addmodal').modal('show');
            }
       });
  });

这是我的php文件。

<?php
  //fetch.php
  $connect = mysqli_connect("localhost", "root", "", "testing");
   if(isset($_POST["id"]))
    {
       $query = "SELECT * FROM productsa WHERE id = '".$_POST["id"]."'";
       $result = mysqli_query($connect, $query);
       $row = mysqli_fetch_array($result);
       echo json_encode($row);
    }
?>

告诉我，如果我需要澄清更多的事情，我不太擅长表达我想发生的事情。任何帮助将不胜感激。

Answer 1

首先在 PHP 脚本中添加一个 JSON 标头，如下所示：

header("Content-Type: application/json", true);

接下来，而不是回显$row你做的：

 echo json_encode($row);

在那之后，你可能不得不改变你的成功：你的Ajax调用的函数来修复打印出的数据，但我会把它留给你:)

进一步阅读和更详细的解释在这里：jQuery $.ajax 请求 dataType json 不会从 PHP 脚本中检索数据