How to remove disabled from a button in different tables using ng-repeat in Javascript?

0

I have a question about the disabled. I have an array of pessoas that I want to include in an array of empresa . I use data-ng-repeat to display the pessoas in a table, where buttons are added to each row to be added in the empresa array. I've disabled the ability to add a person to the business through disabled so that there is no duplicate registration.

var a = angular.module("2",[]);
        a.controller("controller", function($scope){
            $scope.pessoas= [{nome:"Rodrigo", data:"18/01/1991", id:"1"},
                            {nome: "Ana", data:"12/04/1959", id:"2"},
                            {nome: "Teresa", data:"19/07/1984", id:"3"}];
            $scope.empresa=[];              
            $scope.adicionarContatos = function(pessoa){
                $scope.empresa.push(angular.copy(pessoa));

            };
            $scope.removerContato = function(z){
                $scope.empresa.pop(z);
            };          
        });
    <table>
        <tr>
            <th>Nome</th>
            <th>Data</th>
        </tr>
        <tr data-ng-repeat="z in pessoas">
            <td data-ng-bind="z.nome"></td>
            <td data-ng-bind="z.data"></td>
            <td> <button class="btn btn-sucess fa fa-shopping-cart" data-ng-click="adicionarContatos(z)" onclick="disabled=true"></button>
            </td>   
        </tr>   
    </table>

However, as a consequence, I can no longer re-enable the same button by deleting an object from the empresa array, which is also displayed in another table through ng-repeat.

<table>
        <tr>
            <th>Nome</th>
            <th>Data</th>
        </tr>
        <tr data-ng-repeat="z in empresa">
            <td data-ng-bind="z.nome"></td>
            <td data-ng-bind="z.data"></td>
            <td> <button class="btn btn-sucess fa fa-shopping-cart" data-ng-click="removerContato(z)" </button>
            </td>
        </tr>
    </table>

What do I need to do so that by removing the person from empresa , it automatically enables the person in pessoas ? I have tried to assign id to each button, but only the first one is set and document.getElementByID does not work.

    
asked by anonymous 15.07.2018 / 05:19

1 answer

0

The example below adds and removes in a company and to facilitate this, an extra field has been created for people named status to control as it is added and / or removed, for example:

var a = angular.module("2", []);
a.controller("controller", function($scope) {
  $scope.pessoas = [{
      nome: "Rodrigo",
      data: "18/01/1991",
      id: "1",
      status: false
    },
    {
      nome: "Ana",
      data: "12/04/1959",
      id: "2",
      status: false
    },
    {
      nome: "Teresa",
      data: "19/07/1984",
      id: "3",
      status: false
    }
  ];
  $scope.empresa = [];
  $scope.adicionarContatos = function(pessoa) {  
    pessoa.status = true;
    $scope.empresa.push(angular.copy(pessoa));
    console.log($scope.empresa);
  };
  $scope.removerContato = function(pessoa) {
    pessoa.status = false;
    $scope.empresa.pop(pessoa);
    console.log($scope.empresa);
  };
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><divng-app="2" ng-controller="controller">
  <table>
    <tr>
      <th>Nome</th>
      <th>Data</th>
    </tr>
    <tr data-ng-repeat="z in pessoas">
      <td data-ng-bind="z.nome"></td>
      <td data-ng-bind="z.data"></td>
      <td>
        <button class="btn btn-sucess fa fa-shopping-cart" ng-click="adicionarContatos(z)" ng-disabled="z.status">Adicionar Empresa</button>
        <button class="btn btn-sucess fa fa-shopping-cart" ng-click="removerContato(z)" ng-disabled="!z.status">Remover Empresa</button>
      </td>
    </tr>
  </table>
</div>
    
16.07.2018 / 01:46