{ "id": "TD02", "title": "Row edit in a dialog", "topic": "tables", "use": "A record is corrected from its row in a dialog. The table stays text; “Edit” at the end of the row opens the fields that change — with a check across the fields that would have no room in a cell. This is the way between the editable cell (TD01) and the detail page, for details that change rarely and under conditions.", "decisions": [ "The cells stay text because the fields depend on each other: a check across employment, weekly hours and fixed term needs one place where all of them are visible, which is the dialog.", "One labeled action per row — Edit, with the person in its aria-label — and the row itself opens nothing: the name is no link, because an entry either leads somewhere or acts.", "The dialog shows the fields that change over a job, not the whole record: the name stands in its title and personnel number, team and start date in the subtitle, as the identity, and creating adds name and start date as the first row of the same dialog.", "The check says what to do, at the field it means, and the focus moves there — 'An internship has an end date. Enter it.' instead of 'required'.", "The dialog is wide enough for the fields to stand two by two: six fields in one column are a form to scroll.", "Closing a changed dialog asks first, by Escape, the close button and Cancel alike: an alert dialog names what is lost. Without a change it just closes.", "Saving shows in the row and in the line under the table; a toast appears only when the saved row is out of view. Each change can be undone once: more than one step would be a change history, which belongs in the personnel file.", "Selection serves the export, not the correction: Edit reaches one row and stands in the row, never in the toolbar.", "Only fixed terms ending within three months carry a badge ('ends in 31 days', counted from today), and parental leave is a badge on the employment with the return date in its title: the exception gets the badge, not the norm." ], "try": [ { "do": "Press Edit for Yasemin Demir", "then": "the dialog shows six fields; the name stands in its title, personnel number, team and start date in the subtitle, and none of them can be changed" }, { "do": "Empty Fixed-term until and press Save details", "then": "the date field says “An internship has an end date. Enter it.” and the focus moves there" }, { "do": "Set Employment to Full-time for Elena Schwarz and save", "then": "the message says that full-time is 40 hours and that her 32 hours call for part-time" }, { "do": "Change the location and save", "then": "the row shows the new location, the line under the table says Location changed, and no toast appears" }, { "do": "Press Undo change", "then": "the old value stands in the row again" }, { "do": "Change a field and press Escape", "then": "an alert dialog asks whether the changes are discarded" }, { "do": "Change a field, click beside the dialog, then beside the question", "then": "the same question comes up; clicking beside it goes back to the dialog with the change kept" }, { "do": "Press Add employee", "then": "the same dialog, with name and start date as its first row and the next personnel number in the subtitle" }, { "do": "Type “Payroll” in the search", "then": "four rows remain, and the counter reads “4 of 20 entries”" }, { "do": "Open Filter and choose Internship", "then": "the drawer comes in from the right, a badge stands above the table, and the button reads Filter (1)" }, { "do": "Tick two rows", "then": "the counter adds “2 selected”, and Export becomes available" }, { "do": "Click Fixed-term until", "then": "the column sorts, and those without an end come last" } ], "revision": 1, "changes": [], "reviewed": true, "source": "\n\n
\n \n \n \n Add employee\n \n \n \n Export\n \n \n \n Filter\n \n \n Nobody matches the search and filters\n \n \n \n Reset all filters\n \n \n \n\n
\n

\n \n \n Undo change\n \n
\n\n \n
\n \n \n \n \n
\n Done\n Reset all filters\n \n\n \n \n
\n \n \n \n \n \n \n \n \n
\n Save details\n Cancel\n \n\n \n \n \n\n \n
\n\n\n\n\n\n", "page": "https://test-apps.eurodata.de/a/eurodata-ui/docs/patterns/tables/td02-row-edit-in-a-dialog/", "topicPage": "https://test-apps.eurodata.de/a/eurodata-ui/docs/patterns/tables/" }