通过ajax将发帖请求从选择框发送到PHP页面

时间:2019-03-08 09:21:48

标签: javascript php jquery html ajax

我正在尝试建立一个问答系统,在设置相关选择框时遇到了一些错误
我想将主机选择框(Maters'id)的信息发送到PHP文件(DB.PHP)以处理一组操作。

HTML页面

<?php
require_once "DB.php";
require_once "functions.php";
require_once "stuQuestion.php";
if(! isset($_SESSION['student'])){
  redirect("stulogin/login.php");
  die;
}
$date = userGets($connection , "students_questions" , $_SESSION['students_id']);
?>

<html>
  <head> 


  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
  <script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>


      <script type="text/javascript">
      $(document).ready(function(){
       $('#masters').on('change',function() {

              var mid = $('#masters').val();
              $.ajax({
                  url: 'DB.php',
                  type: 'POST',
                  dataType: 'json',
                  contentType: 'application/json; charset=utf-8',
                  data: 'mid=' + mid
              }).done(function(user){
                  console.log(user);
                  user = JSON.parse(user);
                  $('#topics').empty();
                  user.forEach(function(topic) {
                      $('#topics').append('<option>' + topic.topic + '</option>')
                  })
              })
          })
      })

  </script>

</head>




                <select class="form-control" id="masters" name="masters" >
                    <option selected disabled>Choose Master</option>
                    <?php
                    //id='".$master['id']."' value = '".$master['id']."'
                    foreach($date as $master)
                    {
                        echo "<option id='".$master['id']."' value = '".$master['id']."'> ".$master['master']."</option>";
                    }
                    ?>
                </select>



          <select class="form-control" id="topics" name="topics">

          </select>

      

DB.php

function connectToDB() {
try {

    $connect = new PDO("mysql:host=127.0.0.1;dbname=university","root","");
    $connect->exec("set character set utf8");
    $connect->exec("set names utf8");
    $connect->setAttribute(PDO::ATTR_ERRMODE , PDO::ERRMODE_EXCEPTION);
    return $connect;

   } 
      catch (PDOException $e) 
   {
    die($e->getMessage());
   } }

$connection = connectToDB();

if(isset($_POST['mid'])){
$statment = $connection->prepare("SELECT  topic FROM students_questions 
WHERE user_id = " . $_POST['mid']);
$statment->execute();
$user = $statment->fetchAll(PDO::FETCH_ASSOC);

echo json_encode($user) ;
}
else
var_dump("No Request");


function userGets($conn , $table , $user_id = null) {
$statment = $conn->prepare("SELECT DISTINCT master FROM {$table} WHERE 
user_id = :user_id");
$statment->bindParam("user_id" , $user_id );
$statment->execute();
$master = $statment->fetchAll(PDO::FETCH_ASSOC);

return $master ? $master : false;
}

当我登录并重定向到stuInde​​x.php(包含选择框的页面)时,我将遇到“无请求”!经过三天的时间寻找可能的正确答案后,我到目前为止无法解决:(

感谢您提供的任何帮助。
PS:如果有人需要更多信息,请告诉我,我将发送完整的源代码或共享更多信息。

1 个答案:

答案 0 :(得分:0)

  1. jQuery和引导程序库太多,它们是来自不同CDN的HTTPS和HTTP版本
  2. 数据中的语法错误:
  3. 由于它是默认设置,因此无需解析JSON
  4. 没有错误处理请求。如果您不想执行错误处理,请执行此操作
$(function() {
  $('#masters').on('change', function() {
    var mid = this.value;
    if (val) {
      $.post('DB.php', {"mid": mid}, function(user) {
        $('#topics').empty();
        $.each(user,function(topic) {
          $('#topics').append('<option>' + topic.topic + '</option>')
        })
      })
    }
  })
})

使用

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/popper.min.js"></script>