Edit mode

[z6aak]

To start with thanks for the awesome addon.
I'm presenting a table for users, where all data on each row has to be editable. What I was trying to do is, when a button (table action) is clicked, then all the cells in the row should be input fields. So basically I want to render different component.
I can not find anything that supports this. How would I go about it? I'm new to Ember :)

[alexander-alvarez]

@z6aak you'll need to override cellComponent on your columns to do custom behavior.

In your case it will detect if the row is "selected" and if it is, then it will render an input, otherwise just text.

see:
https://github.com/offirgolan/ember-light-table/blob/master/addon/templates/components/cells/base.hbs#L2
https://github.com/offirgolan/ember-light-table/blob/e656b333/addon/classes/Table.js#L64

the rows have a .selected property you can leverage assuming you've set canSelect on t.body

[z6aak]

Great, I will try that out and let know how far I get with it. Thanks :)

[z6aak]

Overriding cellcomponent does the job. I use own isEditing instead of setting canSelect, because when the input is displayed and I click in it, the select is toggled :)
But say I wanted to have a form around my row when editing so that I for example support submit on Enter etc. out of the box. Have any ideas on this?

[alexander-alvarez]

maybe something like: http://offirgolan.github.io/ember-light-table/#/cookbook/custom-row ?

[z6aak]

Then the form tag will be inside a table, right. I need to put entire table into a form.
But I should be able to make a key binding on Enter and problem solved for now.
Maybe it would still be good to have a editmode with this addon. So that the row is turned into a form when it's being edited.