将表行数据传递给bootstrap模式

时间:2016-04-08 04:38:46

标签: javascript jquery twitter-bootstrap bootstrap-modal

我已经浏览了几个例子,但由于某种原因,我无法从我的表中获取数据以传递给我的模态。我可以使用一些专家指导。

表行是动态填充的,如下所示:

    <tr data-toggle="modal" data-target="#myModal" style="cursor: pointer" data-id="<?php echo $site_info['site_id']; ?>">
        <td><?php echo $site_info['site_id']; ?></td>
        ...                                        

模态和JS如下:

<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog" style="width:55%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">Site Information</h4>
            </div>
            <div class="modal-body">
                <div id="siteDetails">asdf</div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script>

    $(document).ready(function() {

        $('#myModal').on('show.bs.modal', function(event) {

            var getId = $(event.relatedTarget).data('id');
            $("#siteDetails").html('Selected: ' + getId);   

        });

    }); 


</script>

如何确保#siteDetails div更新?

谢谢!

0 个答案:

没有答案