Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Table] Add inline editing for inputs

See original GitHub issue

Bug, feature request, or proposal:

Feature request

What is the expected behavior?

Clicking on a text field should launch a simple edit dialog with an md-input. Hitting Enter would then close the dialog and save the input as the new value for the text field.

What is the use-case or motivation for changing an existing behavior?

This behavior is described in the Data Table section of the Material spec, found here, and would be useful to have as its own component.

Is there anything else we should know?

Accessibility is a real concern here, and there doesn’t seem to be much discussion/affordance defined in the spec for possible solutions. The text field itself could be defined as a button with aria-role="button", but that may be deceptive.

cc @andrewseguin @jelbourn

Issue Analytics

State:
Created 6 years ago
Reactions:175
Comments:34 (5 by maintainers)

Top GitHub Comments

41reactions

willshowellcommented, Oct 30, 2017

Here is a demo of a workaround closer to the spec:

https://stackblitz.com/edit/material2-beta12-es19ub?file=app%2Fapp.component.html

It does require a 3rd party component, but it might inspire a good temporary solution until an official one is developed.

33reactions

pantoniscommented, Jan 24, 2019

@andrewseguin Any update on this old thread?

Top Results From Across the Web

DataTables example - Simple inline editing

First name Last name Position Office Start date Salary Airi Satou Accountant Tokyo 2008‑11‑28 $162,700 Angelica Ramos Chief Executive Officer (CEO) London 2009‑10‑09 $1,200,000 Ashton Cox...

Inline edit - Examples - Components - Atlassian Design System

Inline edit is a wrapper around a custom input component such as a text field. It starts in a read-only view called readView...

Inline Editing and Validation in Tables - Medium

This article describes a few ways of displaying input validation messages when users are performing inline editing of table content.

Inline edit (similar to cells in Editable Table) - OutSystems

I'm trying to get to the underlying controls for the Editable Table. The Editable Table displays information in an Expression, and when clicking...

Inline Editing - Appsmith

Allow adding a row · Users are able to click a button on the table to create a new row of data. Users...