将mysql的值传递给bootstrap modal - pass the value of mysql to bootstrap modal

我想从数据列表中进行选择，并在模态弹出窗口中显示所选数据的结果。我只是不知道如何将id传递给弹出窗口，这样我就可以显示结果。帮助! !

<td> <button class="btn btn-primary " data-toggle="modal" data-id="<?php $id= $row['id'] ?>" data-target="#myModal"  <?php echo"id=$row[id]'";?> >
          View Details
       </button>
 </td>

模式弹出

<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" aria-hidden="true">&times;</button>
                      <h4 class="modal-title" id="myModalLabel">Requisition Details</h4>
              </div>
              <div class="modal-body">
                  <?php
                        $id = $_GET['id'];
                        include('mysql_connect.php');
                        $query11 =  mysql_query ("select * from p_requisition where id = '$id' ") or die(mysql_error());
                        $rows= mysql_fetch_array($query11);
                        echo $rows['details'];
                  ?>                                       
             </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>
                                    <!-- /.modal-content -->
         </div>
                                <!-- /.modal-dialog -->
    </div>

首先，为按钮添加class可以是get-data，

然后在jquery中

$(document).ready(function() {
    $(document).on("click",".get-data"function(){
       var val = $(this).attr("data-id");    
       $.ajax({
            url: "path to ajax file",
            type: "POST",
            dataType: "HTML",
            async: false,
            success: function(data) {
               $('.modal-body').html(data);          
           }
         }); 
     });
});

在ajax文件中写入查询，从mysql中获取数据，操作数据并在弹出窗口中显示。

ajax.php

<?php
     $id = $_POST['id'];
     include('mysql_connect.php');
     $query11 =  mysql_query ("select * from p_requisition where id = '$id' ") or die(mysql_error());
     $rows= mysql_fetch_array($query11);
     echo $rows['details'];// here you need to manipulate the database data with html and pass it on to popup.
?>

use like

<td> 
   <button class="btn btn-primary" onclick='openModel(<?php echo"id=$row[id]";?>') >View Details</button>
  </td>

打开模型，如

  <script>
   function openModel(modelId,rowId){       
       $('#'+modelId).model('open');
       //Ajax call to get data for speciefic id
    }
    </script>

我认为你应该使用ajax调用，当打开模式像这样:

你的模态:

<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" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Requisition Details</h4>
      </div>
      <div class="modal-body">
      </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>
    <!-- /.modal-content -->
  </div>
  <!-- /.modal-dialog -->
</div>

按钮:

<button class="btn btn-primary " data-toggle="modal" data-id="<?php echo $row['id'] ?>" data-target="#myModal" id="myButton">
  View Details
</button>

当点击按钮时，显示模态:

$('#myButton').click(function() {
  $('#myModal').modal('show')
});

如果显示模态，则使用ajax

传递数据

$('#myModal').on('shown.bs.modal', function(e) {
  $.ajax({
    method: "POST",
    url: "getData.php",
    data: {
      dataId: $('#myModal').attr('data-id')
    },
    success: function(data) {
      data = jQuery.parseJSON(data);
        $('.modal-body', '#myModal').html(data);
    }
  });
})

你的getData.php像这样

<?php
//dataId comes from ajax (POST)
$id = filter_input(INPUT_POST, 'dataId');
include('mysql_connect.php');
$query11 = mysql_query("select * from p_requisition where id = '$id' ") or die(mysql_error());
$rows = mysql_fetch_array($query11);
//you should use json_encode, and you can parse when get back data in ajax
echo json_encode($rows['details']);