使用AJAX和PHP更新表单字段

问题：在触发select input的onchange事件后，如何基于MySQL查询更新表单的select输入值和文本输入字段

我所尝试的： 我曾尝试将AJAX与post和get数据类型结合使用，调用一个运行查询并回显结果的php文件。没有显示任何内容。我在过程中遇到的任何错误通常都是导致Server500错误的小错误。我在运行JQuery AJAX请求的函数中放置了console.log语句。检测到更改事件，调用ajax success。我还尝试了使用.load（）、GET和POST，但也没有成功。我有其他实现AJAX的特性，我尝试过修改它们以适应这个场景，但没有成功

我还尝试只使用一个select输入，更改后将使用AJAX request和.load函数来显示其他输入，这些输入将在php端格式化，并使用selected和反映db结果的值回显到页面

我想要的是： 我想要一个简单的表单示例，其中包含三个选项的选择输入、文本类型输入和提交按钮。该表单是一个客户端后端表单，用于向MySQL数据库发送更新。每个输入代表数据库中的一个文件。其思想是，当用户更改select inputs selected值时，将执行一个查询，使用所选值仅返回一个结果。该字段的每个字段记录db中的值，现在应该反映在表单中。首先，告诉我这是否是解决这个问题的正确方法，如果不是，告诉我你会怎么做

index.php示例：

    <form action="editForm.php" method="POST" enctype="multipart/form-data">
        <select id="contact_name" name="contact_name" placeholder="Select Contact" required>
            <option value="John Smith">John Smith</option>
            <option value="Jane Doe">Jane Doe</option>
            <option value="George Washington"></option>
        </select>    
        <input type="text" name="age" placeholder="Age" required>
        <input type="text" name="race" placeholder="Select Race" required>
        <select id="veteran_status" name="veteran_status" placeholder="Select Veteran Status" required>
            <option value="Yes">Yes</option>
            <option value="No">No</option>
        </select>
    </form>

editForm.php：

    include 'includes/db.php';
    $name = $_POST['contact_name'];
    $sql = "SELECT * FROM contacts;";
    $result = mysqli_query($conn, $sql);
    if (mysqli_num_rows($result) > 0) {
        $lastValues = array();
        while($row = mysqli_fetch_assoc($result)) {
          $age = $row['age'];
        }

        <input type="text" name="age" value="<?php echo $age; ?>">


        <?php
        }
        ?>

include'includes/db.php'；
$name=$\u POST['contact\u name']；
$sql=“从联系人中选择*”；
$result=mysqli\u查询（$conn，$sql）；
如果（mysqli_num_行（$result）>0）{
$lastValues=array（）；
while（$row=mysqli\u fetch\u assoc（$result））{
$age=$row['age']；
}
你的索引：

<select id="contact_name" placeholder="Select Contact" required>
            <option value="John Smith">John Smith</option>
            <option value="Jane Doe">Jane Doe</option>
            <option value="George Washington"></option>
</select>  

<form action="editForm.php" id="form" method="POST" enctype="multipart/form-data">  
<select name="contact_name" id="contact_form" placeholder="Select Contact" required>
            <option value="John Smith">John Smith</option>
            <option value="Jane Doe">Jane Doe</option>
            <option value="George Washington"></option>
</select> 
        <input type="text" id="age" name="age" placeholder="Age" required>
        <input type="text" id="race" name="race" placeholder="Select Race" required>
        <select id="veteran_status" name="veteran_status" placeholder="Select Veteran Status" required>
            <option value="Yes">Yes</option>
            <option value="No">No</option>
        </select>
    </form>

    $("#contact_name").on("change", function() {
        var selected = $(this).val();
        $("#form").load("formdata.php?contact="+selected); //normaly you do that with an id as value

        OR

        $.ajax({
           type:"POST",
           url:"formdata.php",
           data: {user: selected},
           dataType: "json",
           success: function(response){
              if(response.status == "success") {
                 $("#age").val(response.age);
                 $("#race").val(response.race); 
                 $("#veteran_status").val(response.status);
              } else {
                 alert("No data found for this user!");
           }
        });
    });

您还可以删除表单中的操作、方法和enctype，因为这将在ajax函数中设置；）

我建议您在选择字段中使用userid作为值，并且您还需要在表单中填写联系人姓名或创建一个隐藏的输入字段，以便您可以提交表单并知道这是谁的数据。
您的索引：

<select id="contact_name" placeholder="Select Contact" required>
            <option value="John Smith">John Smith</option>
            <option value="Jane Doe">Jane Doe</option>
            <option value="George Washington"></option>
</select>  

<form action="editForm.php" id="form" method="POST" enctype="multipart/form-data">  
<select name="contact_name" id="contact_form" placeholder="Select Contact" required>
            <option value="John Smith">John Smith</option>
            <option value="Jane Doe">Jane Doe</option>
            <option value="George Washington"></option>
</select> 
        <input type="text" id="age" name="age" placeholder="Age" required>
        <input type="text" id="race" name="race" placeholder="Select Race" required>
        <select id="veteran_status" name="veteran_status" placeholder="Select Veteran Status" required>
            <option value="Yes">Yes</option>
            <option value="No">No</option>
        </select>
    </form>

    $("#contact_name").on("change", function() {
        var selected = $(this).val();
        $("#form").load("formdata.php?contact="+selected); //normaly you do that with an id as value

        OR

        $.ajax({
           type:"POST",
           url:"formdata.php",
           data: {user: selected},
           dataType: "json",
           success: function(response){
              if(response.status == "success") {
                 $("#age").val(response.age);
                 $("#race").val(response.race); 
                 $("#veteran_status").val(response.status);
              } else {
                 alert("No data found for this user!");
           }
        });
    });

您还可以删除表单中的操作、方法和enctype，因为这将在ajax函数中设置；）

我建议您在选择字段中使用userid作为值，并且您还需要在表单中填写联系人姓名，或者创建一个隐藏的输入字段，以便您可以提交表单并知道这是谁的数据。
只需在editForm.php文件和AJAX调用成功函数中回显$age变量即可提醒res庞塞，就像这样-

editForm.php

include 'includes/db.php';
$name = $_POST['contact_name'];
$sql = "SELECT * FROM contacts;";
$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) > 0) {
    $lastValues = array();
    while($row = mysqli_fetch_assoc($result)) {
      echo $age = $row['age'];
    }
  }
?>

Ajax文件

$("#contact_name).on("change", function(e){
   $.ajax({
    type: 'post',
    url: 'editForm.php',
    data: {name: this.value},
    success: function (response) {
      alert(response);
      console.log(response);
    }
  });
};

只需在editForm.php文件中回显$age变量，并在AJAX调用成功函数中提醒响应-

editForm.php

include 'includes/db.php';
$name = $_POST['contact_name'];
$sql = "SELECT * FROM contacts;";
$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) > 0) {
    $lastValues = array();
    while($row = mysqli_fetch_assoc($result)) {
      echo $age = $row['age'];
    }
  }
?>

Ajax文件

$("#contact_name).on("change", function(e){
   $.ajax({
    type: 'post',
    url: 'editForm.php',
    data: {name: this.value},
    success: function (response) {
      alert(response);
      console.log(response);
    }
  });
};

我是否理解您是否正确选择“john smith”，并将他的年龄、种族和退伍军人状态加载到表单中，以便您可以编辑它？如果您正常进行更改（“更改”）ajax调用，你说你已经尝试过了。然后你将选择的值发送到文件->进行数据库查询->然后替换完整的表单（你只需要在php文件中创建该表单）或者发送一个包含年龄、种族和状态的数组并填充字段..但是请发布一些您尝试的jquery代码..是的，您理解正确。过一会儿我会发布我的代码。您是否正确选择“john smith”然后将他的年龄、种族和退伍军人状态加载到表单中，这样你就可以编辑它了？如果你说你已经尝试过了，你可以正常地进行一个on（“更改”）ajax调用。然后你可以将选择的值发送到文件->进行数据库查询->然后替换整个表单（您只需在php文件中创建该表单）或者发送一个包含年龄、种族和状态的数组并填充字段..但是请发布一些您尝试过的jquery代码..是的，您理解正确。过一会儿我会发布我的代码。我在我的原始文章中添加了一些代码。我理解正确吗？这应该行得通。请记住Ajax请求是异步的。jquery Ajax可以ll的方法不仅仅是“成功”，您甚至应该涵盖错误（）出错的可能性函数-check@Christopher Supertramp如果使用ajax版本，你能画出formatdata.php示例吗？是的，如果你呼出这个json数组，你会在成功函数中得到结果，就像我写的那样，例如ersponse.age等等。我也会更新它，以便你可以检查是否有数据（但实际上应该有数据，因为select字段也应该从数据库中填充）我在我的原始帖子中添加了一些代码。我理解正确了吗？这应该是可行的。请记住Ajax请求是异步的。jQuery Ajax调用的方法不仅仅是Just success方法，您甚至应该涵盖错误（）可能出现错误的可能性函数-check@Christopher Supertramp如果使用ajax版本，你能画出formatdata.php示例吗？是的，如果你呼出这个json数组，你会在成功函数中得到结果，就像我写的那样，例如ersponse.age等等。我也会更新它，以便你可以检查是否有数据（但实际上应该有数据，因为select字段也应该从数据库中填充）这是有效的。克里斯托弗的回答让我找到了正确的方向，但我也使用了部分解决方案，因为我不喜欢JSON格式。使用JSON，您可以在ajax响应中访问不同的字段，如年龄、种族、状态。并且可以直接将它们挂接到htm