Problem with checkbox in selection

0

I'm using checkbox on a table with angularJS that is malfunctioning, there are 2 checkboxes that are on top of the table (to select all), and that of each row. When I select the one from each row, I call a function that adds the object to the object list, if I uncheck it I remove. If I select the checkboxMaster it selects everything, and my selected list is equal to the whole list, if I uncheck it the problem is that if I select all by selecting the cb from above, and try to unmark some, it is destroying the table row. That problem only happens if I have selected all before.

>

See the code:

//Adiciona um obj a lista a cada seleção de checkbox
function addListaAdicionar(elemento){


        if(vm.listaAdicionar.indexOf(elemento) == -1){
            vm.obj = {
                    codigo : elemento.codigo,
                    descricao: elemento.descricao,
                };
                vm.listaAdicionar.push(elemento);
        }
        else{
                //Remove o elemento da lista se desmarcar
              vm.listaPoderAdicionar.splice(vm.listaPoderAdicionar.indexOf(elemento) , 1);

        }       

    }

    //Função para seleção de todos os  checkBox
     function selecionarTudo() {
            if(vm.selecionaTudo) {
                vm.selecionaTudo = false;
            } else {
                vm.selecionaTudo = true;
            }

            angular.forEach(vm.listaObj, function (obj) {
                obj.selecionado = vm.selecionaTudo;
            });
            //se desmarcar o cbTodos zera a lista
            if(vm.selecionaTudo == false)
            vm.listaAdicionar = [];
            else
                vm.listaAdicionar = vm.listaObj;


        }

HTML:

<table id="tableExport" class="tableScrollable table genericTable table-striped tbPadrao" st-table="vm.listaObj" st-safe-src="vm.listaObjOrdenavel" style="width: 100%">
        <thead>
            <tr>
                <th  width="20px">
                    <input type="checkbox" data-ng-model = "vm.selecionaTudo" id="cbMaster"
data-ng-click = "vm.selecionarTudo()"> 
                </th>

                <th class="st-sort-default" st-sort="codigo" width="75px">
                    Código
                </th>
                <th class="st-sort-default" st-sort="descricao" >
                    Descricao
                </th>

            </tr>
            <tr>

            <th></th>
                <th>
                    <input  style="width: 100%;" type="text" st-search="codigo" />
                </th>
                <th>
                    <input type="text" style="width: 100%;" st-search="descricao" />
                </th>

            </tr>
        </thead>
        <tbody>
            <tr data-ng-repeat="obj in vm.listaObj">
                <td text-align: right;"> <input type="checkbox" name="cbRow" data-ng-model = "obj.selecionado"  data-ng-click="vm.addPoderListaAdicionar(obj );"></td>
                <td text-align: right;">{{obj .codigo}}</td>
                <td text-align: left;">{{obj .descricao}}</td>

            </tr>
        </tbody>
    </table>
</div>

The problem is only when I select All and I try to unmark one, instead of just dropping the splice in the list, it is destroying the table row together.

    
asked by anonymous 23.10.2015 / 15:08

1 answer

0

You could change your logic to this:

HTML:

<tr data-ng-repeat="obj in vm.listaObj">
   <td> <input type="checkbox" name="cbRow" data-ng-model =  "obj.selecionado"  data-ng-click="vm.addPoderListaAdicionar($index);"></td>
   <td>{{obj.codigo}}</td>
   <td>{{obj.descricao}}</td>
</tr>

JavaScript / Angular:

$scope.addPoderListaAdicionar = function(index){
    vm.listaObj[index].selecionado = !vm.listaObj[index].selecionado;
}

$scope.selecionarTudo = function(){
   angular.forEach(vm.listaObj, function (obj) {
            obj.selecionado = vm.selecionaTudo;
   });
}
    
23.10.2015 / 17:49