Javascript 加载特定页面id时Datatables不工作

我的页面上有完整的数据表，如图所示

我有一个问题，一旦我激活或停用我的员工，数据表搜索和排序将消失。我想我的错误在加载部分。加载具有div id的特定页面的正确方法是什么

这是激活或停用我的员工时的输出

因为我所做的是在我的基本url+“adminpage/userpage”中，这是一个供用户和员工使用的页面。我刚才做的是，当我按view staff时，它将隐藏用户并显示位于同一链接中的staff页面

这是我的代码

$(document).ready(function(){
$("#user-page").show();
$("#viewstaff").on("click",function(){
$("#user-page").hide();
$('#staff-page').show();
});
$("#viewuser").on("click",function(){
$("#staff-page").hide();
$("#user-page").show();
});})

我的激活代码在这里

function activate_staff(id){

        swal({
  title: 'Are you sure?',
  text: "You want to activate this user?",
  type: 'info',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, Deactivate it!'
}).then(function() {
    $.ajax({
        url : base_url+"adminpage/staff_deactivate/"+id,
        type: "POST",
        success: function(data){
           $('#dataTables-example1').DataTable();

            var result = JSON.parse(data);

            if(result===1){

              swal({
                title: 'Deactivate Success',
                // text: "will remove within 1 sec",
                type: 'success',
                timer: 1500,
                showConfirmButton: false
              }).done()
                window.setTimeout(function(){ 
                 $("#wrapper-staff").load(base_url+"adminpage/useraccount #wrapper-staff > *");

                 } ,1500)
            }
        },
        error: function (jqXHR, textStatus, errorThrown){
            swal("Oops...", "Something went wrong :(", "error");
        }
    });
})}

function deactivate_staff(id){
    swal({
  title: 'Are you sure?',
  text: "You want to deactivate this user?",
  type: 'info',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, Activate it!'
}).then(function() {

    $.ajax({
        url : base_url+"adminpage/staff_activate/"+id,
        data: $(this).serialize(),
        type: "POST",


        success: function(data){

            var result = JSON.parse(data);

            if(result===1){

              swal({
                title: 'Activated Success',
                // text: "will remove within 1 sec",
                type: 'success',
                timer: 1500,
                showConfirmButton: false
              }).done()
                window.setTimeout(function(){


                  $("#wrapper-staff").load(base_url+"adminpage/useraccount #wrapper-staff > *");

                 } ,1500)


            }
        },
        error: function (jqXHR, textStatus, errorThrown){
            swal("Oops...", "Something went wrong :(", "error");
        }
    });
})    }

这是给你的

function activate_staff(id){

        swal({
  title: 'Are you sure?',
  text: "You want to activate this user?",
  type: 'info',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, Deactivate it!'
}).then(function() {
    $.ajax({
        url : base_url+"adminpage/staff_deactivate/"+id,
        type: "POST",
        success: function(data){
           $('#dataTables-example1').DataTable();

            var result = JSON.parse(data);

            if(result===1){

              swal({
                title: 'Deactivate Success',
                // text: "will remove within 1 sec",
                type: 'success',
                timer: 1500,
                showConfirmButton: false
              }).done()
                window.setTimeout(function(){ 
                 $("#wrapper-staff").load(base_url+"adminpage/useraccount #wrapper-staff > *");

                 } ,1500)
            }
        },
        error: function (jqXHR, textStatus, errorThrown){
            swal("Oops...", "Something went wrong :(", "error");
        }
    });
})}

function deactivate_staff(id){
    swal({
  title: 'Are you sure?',
  text: "You want to deactivate this user?",
  type: 'info',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, Activate it!'
}).then(function() {

    $.ajax({
        url : base_url+"adminpage/staff_activate/"+id,
        data: $(this).serialize(),
        type: "POST",


        success: function(data){

            var result = JSON.parse(data);

            if(result===1){

              swal({
                title: 'Activated Success',
                // text: "will remove within 1 sec",
                type: 'success',
                timer: 1500,
                showConfirmButton: false
              }).done()
                window.setTimeout(function(){


                  $("#wrapper-staff").load(base_url+"adminpage/useraccount #wrapper-staff > *");

                 } ,1500)


            }
        },
        error: function (jqXHR, textStatus, errorThrown){
            swal("Oops...", "Something went wrong :(", "error");
        }
    });
})    }

---

您必须像这样将数据表更改为服务器端。之后，您可以在每行添加按钮，如下所示：

table = $('#dataTables-example').DataTable({ 
    "serverSide": true, //Feature control DataTables' server-side processing mode. 

    // Load data for the table's content from an Ajax source 
    "ajax": { 
        "url": "<?php echo site_url('serversidedt/ajax_dt')?>", 
        "type": "POST" 
    }, 

    "columns": [ 
        {data: "fname"}, 
        {data: "lname"}, 
        {data: "email"}, 
        {data: "status"}, 
        {data: myButton, searchable: false, orderable: false} 
    ] 

}); 

function myButton(data, type, dataToSet) { 
    if(dataToSet.status == 1){ 
       return "<button class='btn btn-primary'>Active</button>"; 
    }else{ 
       return "<button class='btn btn-primary'>Desactive</button>"; 
    } 
};

table.ajax.reload( null, false )

---

希望有帮助。

为什么要加载另一页？为什么不刷新表格？@John我只是在探索或者说尝试一下，如果有一种方法可以在1页中合并用户和工作人员。就像我单击view staff时一样，它将显示人员id并隐藏用户id，反之亦然。问题是，当我激活或停用staff时，datatables的搜索和分页消失了。您正在使用datatables库。然后，如果加载另一个表而没有像对第一个datatable那样使用datatables初始化此表，则第二个表将无法工作。因此，您必须使用Datatables初始化第二个表以获取所有功能。但我不明白为什么要在元素中加载页面。刷新表更适合您的情况。@John在这种情况下。你说的刷新桌子我该怎么办？因为我是datatables和jquery的新手。只是尝试新事物。让我们一起来。