Remove unchecked value from an array angular js

Question

I am new to angular js. I have a checkbox with a table .

<td><input type="checkbox" ng-if="report.attributes.message.length > 0" ng-bind="report.attributes.message" ng-click="getcheckedData(report.attributes.message)">{{ report.attributes.message }}</td>

Here , I have a method getcheckedData(). So, In that method

   var messages = [];

   $scope.getcheckedData = function(SelectedVal) {     
       $("input:checkbox[type=checkbox]:checked").each(function() {
          if ($.inArray(SelectedVal , messages) === -1){
                messages.push(SelectedVal);
           }
        });
         return messages;
  };

I have an array which I declared globally,.So, I want to take the value of selected checkbox table data into that array. I am able to get that value in array. So, when user unchecks then the value which is unchecked should also get removed from that array . So, when user checks then , I have given one button on that I am sending all checked messages to the backend. So, When I uncheck and press the button that time all messages still remain in the array.

    $scope.sendAllMessages = function() {      
      uploadService.SendMessagesToQueue(uploadService.currentFileName,$scope.documentType,messages)
     .then(function () {
        }, function (error) {
         $scope.errorMessage = error.status + " : " + error.statusText;
         toastr.error($scope.errorMessage, 'Error : ' + error.status);
         if (error.status === 401) {
             loginService.authenticationError();
         }
       })
       .finally(function () {

        });
     };

For button -

<button type="submit" ng-click = "sendAllMessages()" class="button-size btn btn-primary">Send  </button>

so, How can I resolve this problem ?

Sravan · Accepted Answer · 2017-03-01 06:28:02Z

2

What you have done is not the angular way of achieving what you need.

But if you need to do in the same way of Yours, here is the change you should do.

You should remove the value from the array if it is unchecked, using messages.splice(index, 1);

Here is the changed code of your's, without ng-model(not recommended)

var messages = [];

   $scope.getcheckedData = function(SelectedVal) {     

          if ($.inArray(SelectedVal , messages) === -1){
                messages.push(SelectedVal);
           }
           else
           {
           var index = messages.indexOf(SelectedVal)
           messages.splice(index, 1);
           }

         return messages;
  };

To achieve it in angular way, you need to use ng-model

Here is a sample using Angular

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

function Ctrl($scope) {
   
    $scope.messages = {
      
    };

    $scope.reports = [ { "name": "Sport", "id": "50d5ad" } , {"name": "General", "id": "678ffr" } ];
    
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller="Ctrl" ng-app="app">
    <span ng-repeat="report in reports">
      <label class="checkbox" for="{{report.id}}">
        <input type="checkbox" ng-model="messages[report.id]" name="group" id="{{report.id}}" />
        {{report.name}}
      </label>
    </span>
    <pre ng-bind="messages | json"></pre>    
</div>

edited Mar 1, 2017 at 6:28

answered Mar 1, 2017 at 5:15

Sravan

18.7k3 gold badges33 silver badges54 bronze badges

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

9 Comments

ganesh kaspate Over a year ago

thanks for your help , Actually it is not working for me. If I check then adds in array but if I uncheck then also it remains in array. But next time when I check then it removes from array.check and uncheck is not proper.

Sravan Over a year ago

ok, let me help you. first, which way you want to follow, so that we can proceed accordingly

ganesh kaspate Over a year ago

First one which I am using.

Sravan Over a year ago

just console.log(index), below your index line and check if you are getting index

ganesh kaspate Over a year ago

So, Here what is happening, when I first check then It adds in the array, After when I uncheks the same row then still its in the array, but when I again checks then It removes from the array. and that time it shows index 0.

|

Collectives™ on Stack Overflow

Remove unchecked value from an array angular js

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related