var userDatatable = function (id) {
    $('#datatable_users_container').removeClass('hide');
    goToByScroll('datatable_users_container');

    var dUser = $('#datatable_users').DataTable({
        "responsive"    : true,
        "processing"    : true,
        "serverSide"    : true,
        "destroy"       : true,
        "ajax"          : function (data, callback, settings) {
            $.ajax({
                url         : api.institutions + '/' + id + '/users',
                type        : 'get',
                data        : {
                    'page'      : $('#datatable_users').DataTable().page.info().page + 1,
                    'per_page'  : data.length,
                    'order_by'  : data.order[0].dir,
                    'sort_by'   : data.columns[data.order[0].column].data,
                },
                dataType    : 'json',
                success     : function (response) {
                    callback({
                        recordsTotal    : response.meta.pagination.total,
                        recordsFiltered : response.meta.pagination.total,
                        data            : response.data
                    });

                    // Görselde düzgün görünsün diye, son sütunu ortalar.
                    $('#datatable_users thead th:last').addClass('text-center');
                    $('#datatable_users tbody tr').each(function () {
                        $(this).find('td:last').addClass('text-center');
                    });
                }
            });
        },
        "columns"       : [
            {"data" : "identifier"},
            {"data" : "fullName"},
            {"data" : "email" },
            {"data" : "userType", render : function (data, type, row, meta) {
                if (row.userType == 0) return "Admin";
                if (row.userType == 1) return "Şef";
                if (row.userType == 2) return "Uzman";
            }},
            {"data" : "actions", render : function (data, type, row, meta) {
                return  '<div class="btn-group btn-group-circle btn-group-solid" style="position: relative !important;">' +
                    '<a href="/templates/'+row.identifier+'" class="btn btn-sm green"><i class="icon-magnifier"></i></a>' +
                    '<a href="/templates/edit/'+row.identifier+'" class="btn btn-sm yellow"><i class="icon-note"></i></a>' +
                    '<button class="btn btn-sm red remove-user" data-id="'+row.identifier+'"><i class="icon-trash"></i></button>' +
                    '</div>';
            }},
        ],
        "columnDefs"    : [
            {
                "targets": 'no-sort',
                "orderable": false
            }
        ],
        "bFilter"       : false,
        "sPaginationType": "full_numbers",
    });

    $('#datatable_users tbody').on('click', '.remove-user', function () {
        var identifier = $(this).attr('data-id');
        var dialog = bootbox.confirm({
            size    : 'small',
            message : '<div class="text-center">Silmek istediğinize emin misiniz ?</div>',
            buttons : {
                confirm : {
                    label       : '&nbsp;&nbsp;&nbsp;Evet&nbsp;&nbsp;&nbsp;',
                    className   : 'red-mint'
                },
                cancel : {
                    label       : 'Vazgeç',
                    className   : 'grey-salsa'
                }
            },
            callback : function (result) {
                if (!result)
                    return;

                $.ajax({
                    url         : api.users + '/' + identifier,
                    type        : 'delete',
                    dataType    : 'json',
                    success     : function (response) {
                        toastr.success('Çalışan <em>"'+response.data.fullName+'"</em> silindi.');
                        dUser.ajax.reload(null, false);
                    }
                });
            }
        }).find('.modal-footer').css({'text-align' : 'center'});
    });
};


当用户单击按钮时,我调用userDatatable并重新初始化datatable。第一次,当我单击数据表上的删除按钮时,bootbox会一次性出现(一切正常)。但是,如果我关闭数据表并再次重新初始化,这一次,当我单击数据表上的删除按钮时,bootbox会出现两次,依此类推。

我想再次使用datatable重新初始化bootbox。我尝试在bootbox.confirm调用之前破坏click事件中的模式。这次,确认按钮不起作用。

我如何才能完全销毁bootbox并再次重新初始化。

最佳答案

这是因为您在函数click中绑定了userDatatable,因此每次调用时,都将bind添加到按钮上,因此刷新dataTable之后,按钮上就有了“ 2个绑定”。

解决方法是绑定外部点击userDatatable函数。

关于javascript - 销毁启动箱,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47498394/

10-11 11:33