On click of checkAll checkbox, push its objects in another array object and remove from existing array

Question

Functionality I want to implement is that when I click on "select All" checkbox, I want to push the selected item in new array and delete from current one.

Tried with splice function, but not able to delete all items from the first table.

enter code hereHere is the sample plnkr I have created, So when I click on "select All" from first table, all its items should get pushed in "New Table" and at the same time removed from "First table(named Old table)

What is meant by OP? This is sample plnkr I have created, I need to implement the same functionality in my project — random
– random, Commented Jul 5, 2016 at 17:58
This seems to be for-loop and DOM-manipulation question.. What have you tried ? — Rayon
– Rayon, Commented Jul 5, 2016 at 17:58

David H. · Accepted Answer · 2016-07-05 18:12:33Z

1

This will clear your array and push all entries in $scope.merged

$scope.pushlist = function(data){
    for(var item of data){
        $scope.merged.push({"name":item.name});
    }
    data.length=0
};

answered Jul 5, 2016 at 18:12

David H.

5072 silver badges10 bronze badges

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

Comments

Community · Accepted Answer · 2020-06-20 09:12:55Z

0

Use angular.copy to make an copy of the object

var app = angular.module("myApp", []);

app.controller("SecondCtrl", function($scope) {
  $scope.merged = [];
  $scope.data = [{
    "name": "ABC",
    "selected": false
  }, {
    "name": "HJK",
    "selected": false
  }, {
    "name": "PQR",
    "selected": false
  }, {
    "name": "LMN",
    "selected": false
  }];

  $scope.selectall = function(checkAll) {
    if (checkAll) {
      $scope.merged = angular.copy($scope.data);
      $scope.data.length = 0;
    } else {
      $scope.data = angular.copy($scope.merged);
      $scope.merged.length = 0;
    }
  };
});

<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.js"></script>
<div ng-app="myApp" ng-controller="SecondCtrl">
  <div>
    <h1>Old Table</h1>
    <table>
      <thead>
        <th>
          <input type="checkbox" ng-click="selectall(checkAll)" ng-model="checkAll">Select All</th>
        <th>Name</th>
      </thead>
      <tbody>
        <tr ng-repeat="item in data">
          <td>
            <input type="checkbox" ng-model="item.selected">
          </td>

          <td>{{item.name}}</td>
        </tr>
      </tbody>
    </table>
  </div>
  <hr>
  <div>
    <h2>New Table</h2>
    <table ng-show="merged">
      <thead>
        <th>Name</th>
      </thead>
      <tbody>
        <tr ng-repeat="item in merged">
          <td>{{item.name}}</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

Fiddle Demo

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Jul 5, 2016 at 18:10

Rayon

36.6k5 gold badges54 silver badges78 bronze badges

2 Comments

random Over a year ago

Thanks a lot Rayon :-)

random Over a year ago

In pune as a AngularJSJavascript Developer, a newbie

Collectives™ on Stack Overflow

On click of checkAll checkbox, push its objects in another array object and remove from existing array

2 Answers 2

Comments

Fiddle Demo

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related