如何在modal中从mysql中获取对应的id数据？答案

【问题标题】：How to get the corresponding id data from mysql in the modal?如何在modal中从mysql中获取对应的id数据？
【发布时间】：2019-06-20 11:16:44
【问题描述】：

我的网站上有不同的图片按钮，点击图片后会显示不同的模式。我为图像按钮分配了不同的 ID。我想从mysql中获取对应的id数据到模态内容中。但是如何将 jquery 的值传递给 php？

我创建了一个变量来存储 imagebutton 的 id。但我不知道如何将值传递给php并使用它从我的sql中获取数据。

// imagebutton主页面//

<div class="col-md-2 col-4">
<a class="btn btn-primary pull-right playerbutton" data-toggle="modal" 
href="#" id="5"><img src="images\123.png" class="squadplayerimg"></a>
<div class="modal-container"></div>
</div>

// 外部模态//

<!--  player Modal -->
<div class="modal fade" id="modal5" tabindex="-1" role="dialog" aria- 
labelledby="modal5" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">

//jquery脚本//

$('a.playerbutton').click(function(event) {
    var status = $(this).attr('id');
    var url = "modal.php?id=" + status;
    alert(url);
    $('.modal-container').load(url,function(result){
        $('#modal' + status).modal({show:true});
    );
});

我想用url中的id从mysql中获取对应的数据。但我不知道如何将值传递给 php。谢谢你的帮助。

//php//

<?php include 'login.php';
$id = $_GET["id"];
$sql = "SELECT * FROM player
WHERE id = "$id";";
$res=$mysqli->query($sql);
if (mysqli_num_rows($res) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($res)) {
    echo "id: " . $row["ID"]. " - Name: " . $row["Name"].  "<br>";}
} else {
echo "0 results";
}
$mysqli->close();
?>


<!--  player Modal -->
<div class="modal fade" id="modal+$id" tabindex="-1" role="dialog" aria- 
labelledby="modal+$id" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<!--  Content of modal -->

【问题讨论】：

你似乎已经从 jQuery 传递了这个数字。你的 php 是什么样子的，具体的问题是什么？
你好 jeroen 感谢您的回答。我想知道 var url = "modal.php?id=" + status;是否正确，因为我从回应中一无所获。如果我使用 var url = "modal.php";我可以恢复模态。
您好 Dharman，感谢您回答我的问题，我正在努力如何将 jquery 中的 id 值传递给 php 以从 mysql 获取数据。有什么方法可以执行此操作吗？谢谢
Ajax 呢？

标签： php jquery mysqli bootstrap-4 bootstrap-modal

【解决方案1】：

如果我理解正确，您希望数据以存储在 SQL 数据库中的模式呈现。本质上，你不能轻易地用 Javascript 渲染 PHP，而不会对你的代码造成一些破坏。

更好的方法是，如果您设置一个可以接受数据的单独 PHP 文件，然后将其分别重新生成到您的元素中

您可能希望在您的服务器端 php 文件中包含这样的内容。

`<?php
///This is to protect the various API methods
   error_reporting(0);
   $method = $_SERVER['REQUEST_METHOD'];
   switch ($method) {
   case 'PUT':
      header("Location: https://yoururl");   
     break;
   case 'POST':
      $json = json_decode(file_get_contents('php://input'), true);
      header( "Content-Type: application/json" );
      http_response_code (200);
      echo json_encode($json);
      break;
  case 'GET':
     header("Location: https://yoururl"); 
     break;
  default:
     header("Location: https://yoururl");  
     break;
 }

fucnction RetrieveDataFromServer($data){
/// Do something to get your data
return $data;
}

然后你需要像这样设置你的 ajax 查询：

$.ajax({
    type:'post',
    url:'url for your php file',
    contentType: 'applicaition/json',
    data: data /// (could  be form data or data required like the id),
    success: function (data){
     //Inspect the data and then append to your html elements
    },
    error: function(x,e){
       console.log(e) ///This is so you can inspect the console and find our the errors you are facing in posting the data
    if (x.status==0) {
            console.log('You are offline!!\n Please Check Your Network.');
        } else if(x.status==404) {
            console.log('Requested URL not found.');
        } else if(x.status==500) {
            console.log('Internel Server Error.');
        } else if(e=='parsererror') {
            console.log('Error.\nParsing JSON Request failed.');
        } else if(e=='timeout'){
            console.log('Request Time out.');
        } else {
            console.log('Unknow Error.\n'+x.responseText);
        }
    }
});

我希望这会有所帮助，并希望我已经回答了您的问题。

注意：请记住这是异步的，您可能需要考虑服务器调用的时间安排并将其呈现在页面上。

如果我遗漏了什么，只需添加评论，我可以在需要的地方更新答案。

【讨论】：