Problem marking all checkboxes

Question

Problem marking all checkboxes

Navigation

#1 by (3 votes)
#2 by (3 votes)
#3 by (3 votes)

3

insira o código aqui How do I proceed to mark the input's checkbox? It's just unchecking.

Here are the codes for help:

HTML

<div class="col-md-11">
<div style="text-align: right;" class="checkbox">
<label><input type="checkbox" ng-click="marcarDesmarcarTodos('checkParticipantes')" id="ckeckAll" name="checkAll" />Marcar/Desmarcar Todos</label>
</div>
</div>

<input type="checkbox" name="checkParticipantes" ng-click="ckeckMarcarDesmarcarTodos()" ng-model="participante.selecionados[pessoa.ID_PESSOA_EVENTO]" />

JavaScript - AngularJS

$scope.ckeckMarcarDesmarcarTodos = function () {
        if( $('#ckeckAll').is(':checked')) {
            $('#ckeckAll').prop("checked", false);
        }else {
            $('#checkAll').prop("checked", true);
        }
    };        

$scope.selectedAll = false;
$scope.marcarDesmarcarTodos = function ()
{
    $scope.selectedAll = !$scope.selectedAll;
    if ($scope.selectedAll) {
        $scope.participante.selecionados = {};
        angular.forEach($scope.participante, function (item) {
            $scope.participante.selecionados[item.idPessoaEvento] = $scope.selectedAll;
        });
    } else {
        $scope.participante.selecionados = {};
    }
};

javascript angularjs

asked by anonymous 17.02.2017 / 17:52

3 answers

3

Do this:

$scope.ckeckMarcarDesmarcarTodos = function () { 
     if( $('#ckeckAll').is(':checked') ) {
           $('#ckeckAll').prop( "checked", false );
     } else {
           $('#ckeckAll').prop( "checked", true);
     }
};

There was only one else left to mark the checkboxes, I also changed the removeAttr to prop, which is more appropriate.

17.02.2017 / 17:59

3

A purely Angular solution (without jQuery):

angular.module('myApp', [])
.controller('myController', function($scope){
  $scope.selected = {};

  $scope.items = ['Item 1','Item 2','Item 3','Item 4']; 

  $scope.checkAll = function(){
    angular.forEach($scope.items, function(i){
      $scope.selected[i] = true;
    });
  };
  
  $scope.checkNone = function(){
    $scope.selected = {};
  };
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script><divng-app="myApp">
  <div ng-controller='myController'>
    <div ng-repeat="i in items">
      <input type="checkbox" ng-model="selected[i]" ng-false-value="" />{{i}}
    </div>
<br/>
    <a href="#" ng-click="checkAll()">Marcar Todos</a><br/>
    <a href="#" ng-click="checkNone()">Desmarcar Todos</a>

    <pre>{{selected|json}}</pre>
  </div>
</div>

Using jQuery code in conjunction with Angular is generally not recommended because execution occurs outside the digest loop of the Angular, which may break the 2-way binding .

17.02.2017 / 18:16

The ADO.NET provider with invariant name 'MySql.Data.MySqlClient' is either not registered in the machine or application config file Menu and submenu with bootstrap

score 3 · Accepted Answer

Save the current value in a variable:

var isChecked = $('#ckeckAll').is(':checked');

And "invert" the value of checked

$('#ckeckAll').prop('checked', !isChecked) ;

If checked, it will change to unchecked and vice versa.

$scope.ckeckMarcarDesmarcarTodos = function () {
  var isChecked = $('#ckeckAll').is(':checked');
  $('#ckeckAll').prop('checked', !isChecked);
};