Bootstrap模态和传递值

时间:2015-12-18 16:32:09

标签: javascript php jquery twitter-bootstrap bootstrap-modal

当我点击编辑时,'id'应传递给自己的页面,并且弹出模态。但它不起作用。请帮帮我

PHP和Bootstrap

<tr>        
    <td><?php echo $row['name']; ?></td>   
    <td><a data-toggle="modal" data-target="#myModal" href='?id=<?php echo $row['id']; ?>'>Edit</a> </td>          
</tr>

模态

<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog modal-lg">
         ------
         -----
         -----
    </div>
</div>

1 个答案:

答案 0 :(得分:1)

Edit标记中创建一个类<a></a>。使用此类调用模态。并添加data-Id="<?echo $row['id'];?>"

<tr>        
    <td><?php echo $row['name']; ?></td>   
    <td>
        <a class='Edit' data-toggle="modal" href="#form_modal" data-target="#myModal" data-Id="<?php echo $row['id'];?>">Edit</a>
    </td>          
</tr>

将此代码放在页脚

<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">

        </div>
    </div>
</div>

<强> JS

<script>
$('.Edit').click(function(){
    var Id=$(this).attr('data-Id');
    $.ajax({url:"SomePage.php?Id="+Id,cache:false,success:function(result){
        $(".modal-content").html(result);
    }});
});
</script>

创建 somepage.php (如果您想更改此页面名称。也请更改<script></script>。两者都相关。)

<强> SomePage.php

<?php
$Id=$_GET['Id'];
?>

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
    <h4 class="modal-title" id="fam_id"></h4>
</div>
<div class="modal-body">
    <?php echo $Id;?>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>

有关详情,请点击Show data based of selected id on modal popup