如何使javascript在php数据库查询后工作

how to make javascript works after php database query?

本文关键字：查询 工作 数据库 php 何使 javascript      更新时间：2023-09-26

我的网站使用引导程序框架、javascript（jquery）和php。所以基本上我想按下一个按钮，通过按下它，我们查询数据库并返回结果，结果将显示在引导程序javascript驱动的模式中：因为弹出模式是用javascript编写的，它在php之后运行，所以$行总是显示为未定义。我想知道是否有一种方法可以让php在js之前运行？

<form action="" method="post">
<input type="text" id="field" name="field">
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" name="submit" id="submit">
Launch demo modal
</button>
</form>
<?php
if(isset($_POST['submit'])){
    $link = mysqli_connect("myhost","myuser","mypassw","mybd") or die("Error " .     mysqli_error($link)); 
   //consultation: 
   $query = "SELECT name FROM mytable" or die("Error in the consult.." . mysqli_error($link)); 
   //execute the query. 
   $result = mysqli_query($link, $query); 
   //display information: 
   if ($row = mysqli_fetch_array($result)) { 

   ?>
    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
     <div class="modal-dialog">
      <div class="modal-content">
       <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
          <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
     <div class="modal-body">
    <?php echo $row["name"] . "<br>"; ?>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary">Save changes</button>
  </div>
</div>


 <?php
 }
 }
 ?>

最好将此数据请求分离为AJAX请求，然后在AJAX成功回调中打开模态。

示例：

ajax_handler.php：

if(isset($_POST['submit'])){
    $link = mysqli_connect("myhost","myuser","mypassw","mybd") or die("Error " .     mysqli_error($link)); 
   //consultation: 
 $query = "SELECT name FROM mytable";
   //execute the query. 
 $result = mysqli_query($link, $query); 
 $rows = mysqli_fetch_array($result);
 //always wrap a response in an 'object' (associative array)
 //more infor here: http://haacked.com/archive/2008/11/20/anatomy-of-a-subtle-json-vulnerability.aspx/
 echo json_encode(array('result' => $rows));
}

js代码：

$("#submit").on('click', function(){
    $.post('ajax_handler.php', {submit: true}, function(data){
         var data = JSON.parse(data), markup = '';
         for(var i = 0; i < data.result.length; i++){
              markup = markup + '<div>' + data.result[i] + '</div>';
         }
         $('myModal').modal('open');
         $('.modal-body').append(markup)
    });
});

标记：

<button class="btn btn-primary btn-lg" id="submit">
相关文章：