make a newly added row editable directly

[jothimoorthy]

when I add a new row to a x-editable table the row gets added but it is not editable I need to click on the edit button on that row to make that newly added row editable

I don't what I am missing in my code how to make a newly added row editable directly without clicking the edit button.

[jothimoorthy]

what does this attribute do ? shown="inserted == user" http://jsfiddle.net/NfPcH/93/

[ckosloski]

Per the documentation

Whether form initially rendered in shown state.

[ckosloski]

@jothimoorthy Are you still having an issue?

[bertysentry]

Hi, I have the same issue, where the added row is NOT editable the first time it is added, but IS editable the next times. Quite weird. It may be because I'm using a custom directive for the [Edit] and [Remove] buttons.

I posted this yesterday on SO: https://stackoverflow.com/questions/49215445/custom-angularjs-directive-with-xeditable-doesnt-work-first-time-but-works-af

And I have a Plunker showing the issue: https://embed.plnkr.co/TKsa86FfA8ahb90IQbCu/

Any help will be much appreciated! :-)

[ckosloski]

Try this on your form shown="inserted == access" For some reason it wasn't letting me fork/save so I couldn't test it.

[bertysentry]

Thank you for your reply @ckosloski !

I'm already using shown="access == newDenyAccess" (newDenyAccess is the object being inserted in the array).

So:

• in index.html, I'm calling my directive with shown="access == newDenyAccess"
• in my directive JS, I specify that shown is mapped to shown in my directive scope (scope: { shown: '=' })
• in my directive template, I'm using <form editable-form ... shown="shown">

What I cannot understand is why it works at times, but never the first time for the first row. Even after adding several rows, the first one cannot be edited, while the 2nd and others are editable.

Also, the first row is never editable, i.e. even the [Edit] button doesn't work. So it means the $show() method is failing. And I have nothing in the Console log that would explain the behavior.

Note: Plunker was slow and sometimes failing the other day. Maybe try again now, it should work. It would be cool if you could see the behavior for yourself ;-)

Thank you! :-)

[ckosloski]

I feel like it's some sort of scope issue. If you move the html out of the directive and just have it inline and don't use the directive, it works correctly. I tried different scope options in the directive, but couldn't get anything to work.

[bertysentry]

oh yeah, the editable row works beautifully!... as long as it's not embedded in another directive. I don't understand what is going on. Quite frustrating. Here's my suggestion: allow us to customize the [Add], [Del] and [Cancel] buttons with small templates (not just changing the label). This way, we won't need to embed xeditable-forms into custom directives. What do you say? :-)

[ckosloski]

You can override the template, did you see this: http://vitalets.github.io/angular-xeditable/#default http://vitalets.github.io/angular-xeditable/#bootstrap3 And the overall theme documentation?

[bertysentry]

Oh my goodness, no I hadn't seen this, I'm sorry! This should definitely do the trick! Thank you so much! :-)

[ckosloski]

NP. If that works, please close this issue.