Question

我添加了一个删除选项列，其中包含confirm（）以删除datatable的每一行中的记录。它在datatable的第一页中工作正常，当我单击datatable第二页中的删除图标时它不起作用。请帮我解决问题。

我在这里尝试了代码。

<table class="table table-striped datatable" id="example">
            <thead>
                <tr>
                    <th>State</th>
                    <th>Option </th>
                </tr>
            </thead>
            <tbody>

              <?php
              $query = mysql_query("SELECT id,state FROM state_list");
              while($row = mysql_fetch_array($query)){
              ?>
                <tr class="odd gradeX order-delete" id="ordrrow-<?php echo $row['id']; ?>">
                    <td><?php echo $row['state']; ?></td>
                    <td class="center"><a href="" id="<?php echo "btn-".$row['id']; ?>" class="delete">Delete</a></td>
                </tr>
                <?php
                }
                ?>
            </tbody>
        </table>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>
    <script src="//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
    <script src="datatable-bootstrap.js"></script>
    <script src="bootbox.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('.datatable').dataTable();    
    $('.order-delete').click(function(e) {
    var id = $(this).attr('id').substr(4);
    e.preventDefault();
    bootbox.confirm("Are you sure? ", function(r) {
        if (r) {
            //sent request to delete order with given id
            $.ajax({
                type: 'post',
                url: 'delete.php',
                data: {order_id: id},
                success: function(b) {
                    if (b) {
                        //delete row
                        orTable.fnDeleteRow($('tr#ordrrow-' + id)[0]);
                    } else {
                        //failed to delete, sent noty in
                        notify({
                            text: "Failed to delete, please try again later",
                            layout: "topCenter",
                            type: "alert",
                            timeout: 3
                        });
                    }
                }
            });
        }
    });
});


} );
</script>

Answer 1

看起来您只能将点击操作绑定到js运行时可以看到的.order-delete元素。

尝试更改此行：

$('.order-delete').click(function(e) {

到

 $(document).on('click', '.order-delete', function(e) {

这样做会绑定页面上的每次点击，然后由您的班级过滤掉它们。

这对于ajax和单页网站也非常有用。

如何解决问题模态确认对话框不工作twitter bootstrap数据表分拣机？

1 个答案: