Question

HY，我有以下表与bootstrap有php选择的数据：

FooType

点击按钮打开我这个模态：

    <div class="table-responsive">

        <table class="table table-bordered table-hover">

            <tr>
                <th>Nome</th>
                <th>Cognome</th>
                <th>Telefono</th>
                <th>E-mail</th>
                <th>Azioni Utente</th>
            <tr>

            <?php

                while($contatto = mysql_fetch_assoc($risultati)) {

                    echo "<tr>";

                    echo "<td>" .$contatto['nome']. "</td>";
                    echo "<td>" .$contatto['cognome']. "</td>";
                    echo "<td>" .$contatto['telefono']. "</td>";
                    echo "<td>" .$contatto['email']. "</td>";
                    echo "<td> 
                    <a href='#' class='btn btn-primary' data-id='".$id = $contatto['id']."'><span class='glyphicon glyphicon-pencil'></span></a></button>
                    </td>";
                }

            ?>

        </table>
</div>

使用此javascript：

<div id="myModal" class="modal fade" style="padding-top:15%; overflow-y:visible;">
    <div class="modal-dialog">

        <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
                <h4 class="modal-title custom_align" id="Heading">Modifica Dati Contatto</h4>
            </div>

                <div class="modal-body">
                    <div class="form-group">
                        <input class="form-control" type="text" placeholder="Nome" value = "<?php echo $row[0]; ?>">
                    </div>
                    <div class="form-group">
                        <input class="form-control" type="text" placeholder="Cognome">
                    </div>
                    <div class="form-group">
                        <input class="form-control" type="text" placeholder="Riferimento (Eventuale)">
                    </div>
                    <div class="form-group">
                        <input class="form-control" type="text" placeholder="Numero Telefono">
                    </div>
                    <div class="form-group">
                        <input class="form-control" type="text" placeholder="Indirizzo E-mail">
                    </div>
                </div>

                <div class="modal-footer ">
                    <button type="button" class="btn btn-primary btn-lg" style="width: 100%;"><span class="glyphicon glyphicon-ok-sign"></span> Modifica Contatto</button>
                </div>

            </div>
            <!-- /.modal-content --> 
        </div>
        <!-- /.modal-dialog --> 
    </div>

我想知道用相同id的sql行的值打开模态的最佳解决方案是什么。提前感谢任何建议

Answer 1

按下按钮时我会使用AJAX调用。例如：

<script type="text/javascript"> 
$(document).ready(function() { 
    $('.btn').click(function() { 
        //get id 
        var id = $(this).data('id'); 
        $.ajax({ 
            url: "lookup.php", 
            data: id, 
            type: "POST", 
            cache: false, 
            dataType: "json" 
        }).done(function(response) { 
            // do error checking, etc.
            if (response) { 
                $("#myModal").modal('show'); 
            }  
        }); 
    }); 
</script>

然后从这里返回数据库中的任何数据，你可以使用jQuery将它们附加到模态。

获取表元素的ID并打开具有相同ID的数据的模态

1 个答案: