Question

我的目标是在循环$ viewhh中打开一个带有模式ID的链接的详细信息。我已经通过jquery等尝试了很多不同的方法，并且无法获得任何工作。只是调用页面工作正常，但尝试加载模态对我来说是徒劳的。

<div class="row">
             <div class="col-md-12">
                <p><a class="btn btn-default" href="add_praise.php" role="button">Add a Praise</a></p>
                <h2>Praises</h2>
                <p><?php
                    $query = "SELECT praise.id, praise.title, praise.description, praise.created, member.username FROM praise INNER JOIN member ON praise.member_id=member.id ORDER BY praise.created desc;";
                    $stmt = $db->query($query);
                    printf('<table class="table">');
                    printf('<thead><tr><th>Title</th><th>Posted By</th><th>Posted</th></tr></thead>');
                    while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
                        $created = date('m-d-Y', strtotime($row['created']));
                        $viewhh = '<a href="view_praise.php?id=' .
                                urlencode($row["id"]) . '">' . ($row["title"]) . '</a>';
                        printf("<tbody><tr><td> %s </td> <td> %s </td><td> %s </td><td> %s </td></tr></tbody>", $viewhh, htmlentities($row["username"]), $created, $viewbutton);
                        printf("</table");
                    }
                    ?>   </p>

            </div>

这是被称为

的页面

<?php
$praiseid = urldecode($_GET['id']);
$sth = $db->prepare("select * from praise where id = '$praiseid'");
$sth->execute();
            $result = $sth->fetch(PDO::FETCH_ASSOC);
            $title = $result['title'];
                    $description= $result['description'];


            ?>  
<div class="container">
    <!-- Example row of columns -->
    <div class="row">
        <div class="col-md-4">

            <h2><?php echo $title;  ?></h2>
            <div><?php echo $description;  ?></div>

        </div>
</div>

我尝试添加此功能，但现在只获得第一条记录。

<script>
         $(function () { 

            $("#loadpraise").colorbox({ iframe: true, width: "90%", height: "90%", closeButton: false });

            $("#events").colorbox({
                onOpen: function () { alert("Colorbox onOpen"); },
                onLoad: function () { alert("Colorbox onLoad"); },
                onComplete: function () { alert("Colorbox onComplete"); },
                onCleanup: function () { alert("Colorbox onCleanup"); },
                onClosed: function () { alert("Colorbox onClosed"); }
            });

            $("#childForm").colorbox({ closeButton: false, onClosed: function () { alert($.colorbox.popupResult) } });
        });
     </script>

Answer 1

我使用BootStrap 3模式工作了。

调用记录的链接：只添加了数据切换=＆＃34;模态＆＃34;和data-target =＆＃34; #myModal＆＃34;

$viewpraise = '<a data-toggle="modal" href="view_praise.php?id=' . urlencode($row["id"]) . '" data-target="#myModal">' . ($row["title"]) . '</a>';

在同一页面上包含远程调用的模式。远程页面被加载到＆＃34;模态内容＆＃34;格。

<!-- 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> <!-- /.modal-content -->
    </div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->

然后在名为add的页面上添加其余的模态内容：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>Remote file for Bootstrap Modal</title>  
  <script>

   $('body').on('hidden.bs.modal', '.modal', function () {
        $(this).removeData('bs.modal');
      });</script>

</head>
<body>
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                 <h4 class="modal-title">Modal title</h4>
            </div>          <!-- /modal-header -->
            <div class="modal-body">
             <h2><?php echo $title;  ?></h2>
            <div><?php echo $description;  ?></div>
            </div>          <!-- /modal-body -->
            <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>          <!-- /modal-footer -->
</body>
</html>

将变量传递给jquery

1 个答案: