angularjs add value Cannot set property 'id' of undefined

Question

I'm trying to add a new entry to a table I have this query

$scope.addClient = function() {

  var clientId = $scope.items.length;
  //alert(empid);
  $scope.client.id = clientId++;
  $scope.items.push($scope.client);

}

this is my form

<div>
  <div class="modal-header">
    <h2>Ajouter client</h2>
  </div>    
  <form role="form"  ng-submit="addClient()">
    <div class="modal-body">
      <label for="name">Nom : </label>
      <input type="text" id="name" class="form-control input" ng-model="client.name" value="  {{client.name}}" />

      <label for="age">Age : </label>
      <input type="text" id="age" class="form-control input" ng-model="client.age" value="{{client.age}}" />

      <label for="gender">Sexe : </label>
      <input type="text" id="gender" class="form-control input" ng-model="client.gender"  value="{{client.gender}}" />

      <label for="email">Email : </label>
      <input type="text" id="email" class="form-control input" ng-model="client.email" value="{{client.email}}" />

      <label for="company">Société : </label>
      <input type="text" id="company" class="form-control input" ng-model="client.company" value="{{client.company}}" />
    </div>
    <div class="modal-footer">
      <button  type="submit" class="btn btn-primary" >Confirmer</button>
      <button   class="btn btn-warning" ng-click="cancel()" >Annuler</button>
    </div>
  </form>
</div>

It tells me

Cannot set property 'id' of undefined

and nothing is added.

Answer 1

Your problem is the line

$scope.client.id = clientId++;

because $scope.client is never defined.

To solve this add

$scope.client = {};

before

$scope.addClient = function() { ... }