ブートボックスを破棄する

Question

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を呼び出してデータテーブルを再初期化します。初めて、データテーブルの「削除」ボタンをクリックすると、ブートボックスが一度だけ表示されます（すべては問題ありません）。しかし、データテーブルを閉じてもう一度再アクティブ化すると、今回はデータテーブルの削除ボタンをクリックすると、ブートボックスが2回表示されます。

bootableを再度datatableで再初期化したいとします。私は、bootbox.confirmコールの前に、クリックイベントでモーダルを破壊しようとします。今回は、確認ボタンが機能しません。

どうすればブートボックスを完全に破棄し、もう一度再初期化できますか？あなたはボタンの「2つのバインドをしている」のdataTableあなたをリフレッシュした後ので、あなたはそれを呼び出すたびに、あなたがボタンにバインドを追加機能userDatatableでclickを結合しているためだ

Answer 1

。

解決策は、userDatatableの外のクリックをバインドすることです。