Question

所以我试图在表格的每一行添加一个按钮。我可以通过执行下面的代码来完成此操作，但每次进入下一页并返回时，按钮都会生成。每当我在页面之间移动时，它会向表格添加一个按钮。我不明白为什么会这样。有人可以帮帮我吗。提前谢谢。

$（'＃displayTable'）。on（'draw.dt'，function（）{

    $('.dataTable > thead > tr').append('<th style="width: 163px"></th>');
    //adding button to table.
    $('.dataTable > tbody > tr').append('<td><a href="#" class="btn btn-primary topic-btn" data-toggle="modal" data-target="#add_to_topic">Add to Topic</a></td>');

}）;

Answer 1

您可以使用TableTools扩展名为DataTables向表头添加自定义按钮。

在覆盖选项中：

"aButtons": [
            {
                "sExtends": "text",
                "sButtonText": " ",
                "fnInit": function ( nButton, oConfig ) {
                    $(nButton).attr("title", "Delete selected items");
                    $(nButton).removeClass("DTTT_button").addClass("btn btn-small");
                    $(nButton).append('<i class="icon-trash"></i> <i class="icon-white icon-exclamation-sign"></i>');
                },
                "fnClick": function( nButton, oConfig, oFlash ) {
                    if (!$(nButton).attr('disabled')) {
                        // code to run on click
                        deleteSelectedItems();
                    }
                }
            }
   ]

Answer 2

对于以后寻求答案的任何人，这就是我所做的

<script type="text/javascript">
    $('#displayTable').on('preInit.dt', function () {
        //adding column to table.
        $('.dataTable > thead > tr').append('<th>header</th>');
    });
    $('#displayTable').on('draw.dt', function () {
        //adding button to column.
        $('.dataTable > tbody > tr').append('<td><a href="#" class="btn btn-primary topic-btn" data-toggle="modal" data-target="#add_to_topic">Add to Topic</a></td>');
    });
</script>

如何使用dataTable jquery将按钮绘制到表中

2 个答案: