5

I was looking for a solution to remove items from the Grid; that's why I posted the question before. But when I got the solution from someone, at that time, I thought it solved the issue, but it was using a Filter method.

However, I want the items to be removed from the GRID using a Splice Function.

Here is my old Question Link Angularjs, Applying Action on Selected Checkboxes in Table

I want it to execute using a Splice Function.

Right now the problem I am facing is to pass the index value to the function so that the item can be deleted if that index value is selected/fetched. I am not sure how to fix it.

It would be nice if someone solves the problem and gives a demo link to the updated code.

Here is the Plunker Link for what I have tried so far.Plunker link to show my execution

1
  • kindly see below plunker demo for splice Commented Jun 28, 2013 at 10:19

2 Answers 2

7

Definition of JS array.splice method (from MDN):

array.splice(index , howMany[, element1[, ...[, elementN]]])

So, your removefunction should be written as:

$scope.remove = function(index){
  $scope.students.splice(index, 1);
};

DEMO PLUNKER

EDIT:

I figured you wanted to remove the items by clicking the "x" button with ng-click pointing to remove function.

To remove the items by clicking the checkbox you should set checkbox ngModel to a student property and than put a $watcher on students that would remove those students who have this property set to true:

<tr class="color2" ng-repeat="student in students | filter:search | filter:new_search">
  <td>{{student.Rollno}} <input type="checkbox" ng-model="student.checked"> </td>
  <td>{{student.Name}}</td>
  <td>{{student.Uni}} <button ng-click="remove($index)">x </button></td>
</tr>
$scope.$watch('students', function(students){
   if(!students){
     return;
   }
  $scope.students = students.filter(function(student){
    return !student.checked;
  });
}, true);

PLNUKER

Sign up to request clarification or add additional context in comments.

3 Comments

already have done that, but this dont remove the selected items from the Grid.
The plunker link that I attached proves otherwise.
Sir, i have checked your Demo Plunker link, i cliked on first check box and on the last one but it removed only 1 item from the grid.
6

I have added ng-click to checkbox to make it working

http://plnkr.co/edit/DSVPj3holsf4nhNvEMbQ?p=preview

2 Comments

Thankyou for Reply, Your Code Works Great for the First Time, But next time when i select a check box it removes 2 values?
i mean first time i load page -> i select checkbox then i click remove, item removes, but without refreshing page when i click the other checkbox and i click remove it remove 2 items.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.