2017-03-22 61 views
0

我想刷新datatable後刪除行或使用angularjs重新加載數據表。 我已經用這個代碼顯示了數據列表和刪除行。如何刷新數據表angularjs後刪除行?

app.controller("userscontroller", ["$scope", "$http", "DTOptionsBuilder", "DTColumnBuilder", "userservice","$compile" 


function ($scope, $http, DTOptionsBuilder, DTColumnBuilder, userservic,$compile) {  

$scope.dtColumns = [    
    DTColumnBuilder.newColumn("fullName", "Full Name").withOption('name', 'firstname'), 
    DTColumnBuilder.newColumn("username", "Name").withOption('name', 'username'), 
    DTColumnBuilder.newColumn("email", "Email").withOption('name', 'email'), 
    DTColumnBuilder.newColumn(null).withTitle('Action').withOption('defaultContent', ' ').notSortable() 
     .renderWith(function (data, type, full, meta) { 
      if (data.UserCount > 1) 
       return '<button class="btn btn-primary" ng-click="delete(' + data.id + ');"><i class="fa fa-eye"></i>' + '</button>';      
     })   
] 

$scope.dtOptions = userservice.GetAllUser(DTOptionsBuilder) 
.withOption('processing', true) 
.withOption('serverSide', true) 
.withPaginationType('full_numbers') 
.withDisplayLength(50) 
.withOption('aaSorting', [3, 'desc']) 

function createdRow(row, data, dataIndex) { 
    $compile(angular.element(row).contents())($scope); 
} 
}]); 

這裏我刪除功能:

$scope.delete= function (id) { 
     if (confirm("Are you sure want to delete?") == true) { 
      var getData = userservice.Deleteuser(id); 
      getData.then(function (Msg) { 
       if (Msg.statusText == "OK") { 
       //here what code i written i don't know 
       } 
      }, function (err) { 

      }); 
     } 
    } 

這裏是我的html代碼=>

<table id="tbluserList" datatable="" dt-options="dtOptions" dt-columns="dtColumns" dt-instance="dtInstance" class="table table-hover"> </table> 

回答

1

嘗試下面的代碼,

if (Msg.statusText == "OK") { 
    var index = -1;  
    var users = $scope.users;// Let you have all users here 
    for(var i = 0,len=users.length; i < len; i++) { 
     if(users[i].id === id) { 
      index = i; 
      break; 
     } 
    } 
    if(index === -1) { 
     alert("Something gone wrong"); 
    } 
    $scope.users.splice(index, 1);   
} 

一小段路,

$index在功能和使用$index像切它,

return '<button class="btn btn-primary" ng-click="delete('+data.id+',$index);">...';      

和刪除功能

$scope.delete = function (id,$index) { 
    .... 
    if (Msg.statusText == "OK") { 
     $scope.users.splice($index, 1); 
    } 
    .... 
} 

嘗試reloadData後刪除操作一樣,

//Add below dtOptions 
$scope.dtInstance = {}; 
... 

$scope.delete = function (id) { 
    .... 
    if (Msg.statusText == "OK") { 
     $scope.dtInstance.reloadData(); 
    } 
    ... 
} 
+0

手段,你說我需要先獲取$ scope.users中的所有用戶,然後編寫代碼? – coderwill

+0

這不工作任何其他波? – coderwill

+0

我在這裏找到了相同的場景https://hello-angularjs.appspot.com/removetablerow –