如何在Bootstrap Modal中传递GET变量？

Question

我的代码有问题。我想将PHP变量传递给bootstrap模式。

这是我的代码：

我打开模态的链接：

<td><a class="btn btn-primary btn-xs" data-toggle="modal" data-target="#modal-user" href="userDetails.php?id_user=<?= $rel['id_user'] ;?>"><?= $rel['id_user'] ;?></a></td>

我的模态代码：

<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="modal-user" aria-hidden="true" id="modal-user">
    <div class="modal-dialog modal-lg">

        <?php
            include('userDetails.php');
        ?>

    </div>
</div>

和userDetails.php代码：

<?php

require 'connect.php';

if (isset($_GET['id_user']) && !empty($_GET['id_user'])) {
    $idUser = $_GET['id_user'];
}


$sql = "SELECT * FROM users WHERE id_user=" .$bdd->quote($idUser);
$query = $bdd->query($sql);
$userDetails = $query->fetchAll(PDO::FETCH_ASSOC);


?>

        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Infos</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
            </div>
            <div class="modal-body">
                <?php
                    foreach($userDetails as $details) {
                ?>
                    <p><?= $details['name'] ?></p>
                    <p><?= $details['firstname'] ?></p>
                <?php
                    }
                ?>
            </div>
        </div>

另外，我有这个jQuery代码：

<script>
$( document ).ready(function() {
    $('#modal-user').on('hidden.bs.modal', function () {
          $(this).removeData('bs.modal');
    });
});
</script>

我正在寻找其他帖子和normaly，一切都必须好，但我有一个错误，我仍然不知道为什么...

注意：未定义的变量：第10行的/Applications/MAMP/htdocs/directory/userDetails.php中的idUser

你能帮我吗 ？

Answer 1

单击时，Bootstrap模态href不会调用您的页面。当您include userDetails.php时，您的页面已经加载。因此，您可以在include之前定义get或通过GET变量传递用户id。

所以：

<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="modal-user" aria-hidden="true" id="modal-user">
    <div class="modal-dialog modal-lg">

        <?php
            $_GET['id_user'] = $rel['id_user'];
            include('userDetails.php');
        ?>

    </div>
</div>

在循环中

如果你有一个循环并希望通过jQuery动态地执行它，你可以执行以下操作：

从链接中删除引导程序调用，并添加触发器类modal-btn并使其像：

<a 
    class="btn btn-primary modal-btn btn-xs"
    href="userDetails.php?id_user=<?= $rel['id_user'] ;?>"><?= $rel['id_user'] ;?>
</a>

更新您的模态结构并删除include()：

<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="modal-user" aria-hidden="true" id="modal-user"> 
  <div class="modal-dialog modal-lg">   
    <div class="modal-content"></div>    
  </div> 
</div>

jQuery应该得到链接的href属性并调用bootstrap模态函数load并强制模态到show

$(".modal-btn").on('click',function(e){ //trigger when link clicked
   e.preventDefault(); 
   $('#modal-user').modal('show'); //force modal to show
   $('.modal-content').load( $(this).attr('href')); //load content from link's href
});

所以你的页面userDetails.php将被加载到模态中，你需要从中删除<div class="modal-content">...</div>以避免重复...