使用PHP、Jquery和MYSQL的Ajax Html表单，

我理解这个问题可能完全是幼稚的，但是我已经试着调试了整整一个下午，除了升华之外没有使用IDE。我真的很高兴能得到任何帮助，并在这个问题有效时为未来的初学者很好地格式化这个问题

目前

我的html

<?php
  //connect to the server & database
  $connect = mysqli_connect('localhost','root','root','ikea');

  if(!$connect)
  {
    echo "failed to connect ".mysqli_connect_error();
  }
  // query the database
  $query = 'SELECT * from department 
            where iconpath Like "image%"
            order by name asc';
  $result = mysqli_query($connect,$query);

  // retrieve the resultset
  while( $row[] = $result->fetch_object());
?>
    <form id="question2" method="POST">
        <div class="form-group input-group">
          <select style="width:8.7cm;" id="member_choice" class="form-control">
            <option value="">-- Select One --</option>
            <?php foreach($row as $option) : ?>
              <option value="<?php echo $option->name; ?>"><?php echo $option->name; ?></option>
            <?php endforeach; ?>
          </select><br/><br/>
           <button id="q2-submit" name="q2-submit" style="margin-left:5cm;" type="submit" class="btn btn-default btn-add"> Get Departments! </button>
        </div>
        </form>

目前正在用我的php尝试让它返回“内容”

---

您的问题不断变化。老实说，我建议您学习如何使用AJAX和jQuery提交表单的教程，如

---

您应该使用提交处理程序而不是单击处理程序。你的选择器也错了

HTML 将

name

属性添加到

标记中

<form id="question2" method="POST" action="q2.php">
  <div class="form-group input-group">
    <label>Select Member Card Number</label>
    <select name="member_choice" style="width:8.7cm;" id="member_choice" class="form-control">
      <option value="">-- Select One --</option>
      <?php foreach($row as $option) : ?>
        <option value="<?php echo $option->name; ?>"><?php echo $option->name; ?></option>
      <?php endforeach; ?>
    </select><br/><br/>
     <button style="margin-left:5cm;" type="submit" class="btn btn-default btn-add"> Get Departments! </button>
  </div>
</form>

<div id="content"></div>

PHP（q2.PHP）

---

您的点击处理程序不会阻止表单提交（页面会被刷新），因此您永远看不到ajax响应。请改用提交处理程序：

$('#question2').on('submit',function(e) 
{
    var name = $('#department_choice :selected').val();
        console.log("here");
        $(".return").html("asdad");

    $.post('q2.php', function(data)
    {
        console.log("here1");
        $(".return").html(data);
    });

    return false;//prevent form submit

});

---

你想干什么？让PHP脚本在

#第2季度提交时返回“内容”

单击事件？OT:

标签

无效。它需要

for

属性指向它应该关联的表单元素的

id

。那么问题出在哪里？js不工作吗？“内容”是否未返回？什么？是的js不工作了@echolocation是的，我是。你不应该使用click事件，你应该使用submit事件进行表单尝试现在（：它仍然不会在content div中返回“content”（内容）你介意看一看吗？更新了新的edits@laycat我在.serialize（）上忘记了（）了

<form id="question2" method="POST" action="q2.php">
  <div class="form-group input-group">
    <label>Select Member Card Number</label>
    <select name="member_choice" style="width:8.7cm;" id="member_choice" class="form-control">
      <option value="">-- Select One --</option>
      <?php foreach($row as $option) : ?>
        <option value="<?php echo $option->name; ?>"><?php echo $option->name; ?></option>
      <?php endforeach; ?>
    </select><br/><br/>
     <button style="margin-left:5cm;" type="submit" class="btn btn-default btn-add"> Get Departments! </button>
  </div>
</form>

<div id="content"></div>

$('#question2').on('submit', function(event) 
{
    // stop form from submitting normally
    event.preventDefault();

    var $form = $(this);
    var url = $form.attr('action');

    $.post(url, $form.serialize(), function(data)
    {
        console.log("here1");
        $('#content').html(data.content);
    });

});

<?php

    $content = $_POST['member_choice'];

    echo json_encode($content);

?>

$('#question2').on('submit',function(e) 
{
    var name = $('#department_choice :selected').val();
        console.log("here");
        $(".return").html("asdad");

    $.post('q2.php', function(data)
    {
        console.log("here1");
        $(".return").html(data);
    });

    return false;//prevent form submit

});