Angular X-editable set focus event

Question

I'm using angular-xeditable api.Could you tell me how to setfocus into a control when form 'loads' and press 'add row' button ?

JsFiddle

There is a method named $activate(name) on the above api.But I don't know how to use it with the above scenarios.Thanks.

 // add user
  $scope.addUser = function() {
    $scope.users.push({
      id: $scope.users.length+1,
      name: '',
      status: null,
      group: null,
      isNew: true
    });
  };

Answer 1

Here is a fiddle with what I came up with to fix your problem.

I added a setFocus function call in the addUser method

    $timeout( function() { 
        $scope.setFocus('name', $scope.users.length - 1); 
    }, 50);

    $scope.setFocus = function (id, index) {
        angular.element( document.querySelectorAll("#" + id))[index].focus(); 
    };