Add new Row in editable state

Question

I have a simple repeater in which each row can be edited in-line. As part of that repeater, when I add a new row I would like it to be in the editable state, not static. When I tried adding the $scope.editable = true to the Add Button, it makes the entire repeater editable.

Here's a plunker illustrating my code: http://plnkr.co/edit/tVOLYm2mg5be2L6NpM6k?p=preview

$scope.addRow = function() {
    $scope.accounts.unshift({ name: 'Enter Name', id: 'Enter ID', code: 'Enter Code'});
    //$scope.editable = true;
}

Can anyone assist with what I'm trying to accomplish?

thanks

Community · Accepted Answer · 2017-05-23 11:53:23Z

1

$scope.editable = false;

This statement sets the editable value in the parent scope and ng-repeat makes child scope for every repeat. You need to understand that concept. Look at this question to understand that.

Now, a better way to implement what you want to do is by adding a new property to every account object in your accounts array that makes a row editable or non editable.

So whenever unshifting an account, do as follows:

 $scope.accounts.unshift({
      name: 'Enter Name',
      id: 'Enter ID',
      code: 'Enter Code',
      editable: true
  });

and in html, instead of using editable, use account.editable

You don't need to add editable property to your existing data as non-existent properties are implicitly falsy, so your grid will automatically be in non-editable mode initially.

edited May 23, 2017 at 11:53

CommunityBot

11 silver badge

answered Feb 16, 2017 at 17:50

pranavjindal999

3,0574 gold badges29 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Joseph Sjoblom Over a year ago

I see what you mean. I had tried adding that same code to my data and unshift script, but I didn't have it correct on html side, so wasn't working either. Much appreciation @Pranav Jindal!

pranavjindal999 Over a year ago

Also, read the question and explanation to the question that I've hyperlinked. It'll really make you understand what's happening.

Collectives™ on Stack Overflow

Add new Row in editable state

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related