Как получить соответствующие данные id из mysql в модале?

Question

У меня есть другая кнопка с изображением на моем веб-сайте, и после нажатия на изображение будет отображаться другое модальное изображение.Я назначил другой идентификатор кнопке изображения.Я хочу получить соответствующие данные id из mysql в модальный контент.Но как я могу передать значение jquery в php?

Я создал переменную для хранения идентификатора кнопки image.Но я не знаю, как передать значение в php и использовать его для получения данных из моего sql.

// Главная страница кнопки изображения //

<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 для получения соответствующих данных из 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 -->

Answer 1

Если я правильно понимаю, вы хотите, чтобы данные отображались в модальном режиме, который хранится в вашей базе данных SQL.По сути, вы не можете легко рендерить PHP в Javascript, не вызывая каких-либо уязвимостей в вашем коде.

Лучше всего, если вы настроите отдельный 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);
        }
    }
});

Iнадеюсь, что это полезно, и надеюсь, что я ответил на ваш вопрос.

ПРИМЕЧАНИЕ. Помните, что это асинхронный режим, и вам может понадобиться подумать о времени выполнения вызовов на сервере и отображать его на странице.

Просто добавьте комментарий, если я что-то пропустил, и я могу обновить ответ, где это необходимо.