模态中的充电信息(bootstrap 3.3.6)?

时间:2016-01-15 12:33:57

标签: php twitter-bootstrap twitter-bootstrap-3 modal-dialog bootstrap-modal

我有一个模态,点击 Visualizar 选项后​​我希望它从<div class="container-fluid"> <table class="table table-striped" data-toggle="table" data-search="true" data-show-refresh="true" data-show-columns="true"> <thead> <tr> <th class="th-small" data-align="left" data-sortable="true">ID</th> <th data-align="left" data-sortable="true">Nome</th> <th class="th-small">Ações</th> </tr> </thead> <tbody> <?php foreach ($idade as $key => $v) { ?> <tr> <td><?= $v->id ?></td> <td><?= $v->titulo ?></td> <td> <form data-toggle="validator" method="POST" enctype="multipart/form-data"> <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="submit" data-toggle="dropdown">... <span class="caret"></span></button> <ul class="table-modal dropdown-menu"> <li class=""><a data-toggle="modal" data-target="#modal-select">Visualizar</a></li> <li><a data-toggle="modal" data-target="#editarIdade">Editar</a></li> </ul> </div> </td> </tr> <?php } ?> </tbody> </table> <!-- Modal VISUALIZAR --> <div class="modal fade" id="modal-select" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title" id="cadastroIdadelLabel">Visualizar - Idade</h4> </div> <div class="modal-body"> <form class="form-inline" role="form" data-toggle="validator" action="Idade/page/visualizar"> <fieldset> <div class="form-group"> <div> <label>Idade:</label> <?= $v->titulo ?> </div> <div> <label>Código:</label> <?= $v->id ?> </div> </div> </fieldset> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Voltar</button> </div> </form> </div> </div> </div> 加载信息。

但是,它只加载第一个表ID,无论我要查看哪个表项。它始终显示相同的信息。

以下是我正在使用的代码。

"frameworks": {
    "dnx541": {
        …

有人可以帮我找到问题吗?

1 个答案:

答案 0 :(得分:0)

首先,您在<form>代码中打开了foreach标记(旁注:此处不需要表单)

<?php foreach ($idade as $key => $v) {?>
    <tr>
        <td><?= $v->id ?></td>
        <td><?= $v->titulo ?></td>
        <td>
            <form data-toggle="validator" method="POST" enctype="multipart/form-data">
            <div class="dropdown">
                <button class="btn btn-default dropdown-toggle" type="submit" data-toggle="dropdown">... <span class="caret"></span></button>
                <ul class="table-modal dropdown-menu">
                    <li class=""><a data-toggle="modal" data-target="#modal-select">Visualizar</a></li>
                    <li><a data-toggle="modal" data-target="#editarIdade">Editar</a></li>
                </ul>
            </div>
            </form>
        </td>
    </tr>
<?php } ?>

其次,您必须在<form>内置{} {1}}标签(旁注:modal-body<?= $v->titulo ?>不会显示<?= $v->id ?>以外的任何值

foreach

第三,您必须将id <div class="modal fade" id="modal-select" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title" id="cadastroIdadelLabel">Visualizar - Idade</h4> </div> <form class="form-inline" role="form" data-toggle="validator" action="Idade/page/visualizar"> <div class="modal-body"> <fieldset> <div class="form-group"> <div> <label>Idade:</label> <?= $v->titulo ?> </div> <div> <label>Código:</label> <?= $v->id ?> </div> </div> </fieldset> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Voltar</button> </div> </form> </div> </div> </div> 作为数据属性<?= $v->id ?>添加到模态触发按钮,并使用BS Modal事件,在显示模态时将其传递给模态

data-id="<?= $v->id ?>"

模态秀活动。

<li class=""><a data-id="<?= $v->id ?>" data-toggle="modal" data-target="#modal-select">Visualizar</a></li>

第四,要从数据库中获取$(document).ready(function(){ $('#modal-select').on('show.bs.modal', function (e) { var id = $(e.relatedTarget).data('id'); alert(id); //pass `id` to input, HTML selector do what ever you like with it }); }); 的数据并以模态显示,请查看此answer

您可以询问是否需要更多解释或帮助完成任何步骤。