Lesson 5 companion — Employee Task Manager reference

Project guide · Completion assignment

Use this reference as you work through the project. It connects the requirements to patterns from earlier lessons and helps you recover one feature at a time.

1. Map the project before coding

Part	Responsibility
model/tasks.json	One employee, two starting tasks and the empty draft title.
view/Main.view.xml	Employee summary, creation form, task rows and action controls.
controller/Main.controller.js	Loading, validation and task operations.
README.md	Purpose, setup commands and persistence limits.

The new project folder deliberately keeps training.fiori.day1 as its app identity. This exercise changes the business scenario, not the namespace. Keep the generated shell and default route.

2. Know which object a path describes

Path or binding	Meaning
/employee/name	Name shown in the employee summary.
/tasks	Collection bound to List or Table items.
/draftTask/title	Unfinished title entered in the form.
{title} inside a row	Title of that row's task.
{status} inside a row	Open or Done for that task.

Initialize employee, tasks and draftTask before loading. Keep Add disabled until the request succeeds. A missing file or invalid JSON should produce failure feedback, not an apparently empty successful app.

3. Reuse the CRUD patterns

Requirement	Adapt from Lesson 4	Change for this project
Add Task	onAddEmployee	Read /draftTask/title; create a task with status Open.
Toggle status	onToggleEmployee	Switch Open ↔ Done.
Delete	onDeleteEmployee	Filter /tasks using the selected task ID.
Reset input	Draft replacement	Reset to { title: "" }.

Creation should trim the title, reject an empty result, calculate an unused numeric ID, create a new object, update /tasks through setProperty, and reset the draft. Clear the field's old error state when the next submission is valid.

Titles may repeat. IDs distinguish the records. Deleting by title can accidentally remove both copies; deleting by a hard-coded array position can remove the wrong task after another deletion.

4. Choose a layout you can explain

A responsive Table reuses the Lesson 4 table pattern directly. A List with CustomListItem lets you place a VBox containing title, status and actions inside each row. Keep the row actions inside the bound template so they inherit the task context.

Use an associated Label for the Input, meaningful local IDs, templateShareable: false and an understandable empty-state message. The result can look different from the completed reference while meeting the same requirements.

No extra routing, dialogs or backend code is needed to finish this project.

5. Inspect behavior in the right order

Observation	Where to investigate
Employee and tasks never appear	Request URL, JSON syntax and load handlers.
Summary appears but task rows do not	/tasks aggregation binding and default model.
Add appears to work only once	Draft-reset shape, error state and ID calculation.
An action has no row context	Button placement inside the bound row.
Changes disappear on reload	Expected: the app reloads seed data and has no persistence service.

The assignment checklist deliberately includes duplicate titles, deletion followed by another action, an empty list and loading failure. These expose mistakes that a single successful Add action cannot reveal.

6. Check yourself

Would pointing loadData at an OData URL make this task manager save its changes permanently?

Compare your explanation

No. JSONModel operations here change browser memory. A service-backed application needs an appropriate model, write operations, save/error handling and a backend that supports them. Loading data from a different URL does not automatically create that write behavior.

7. Compare with the reference carefully

Follow Lesson 5's project setup to copy your completed Employee Directory into a new folder, then create tasks.json from the guide and adapt your app. After an independent attempt, open the completed reference in a separate folder. Compare one operation, explain its data flow, adapt your own code and rerun the matching checks. Record the source you used in your assignment notes.

For your demonstration, reload, add a task, toggle it, delete a different task and reload again. Explain what changed in the model and why the seed data returns. Your README should let someone else install and run the app.

8. Official documentation and examples

SAPUI5 references use 1.148.12. References checked on 15 November 2026.

Reference	What to look up
JSONModel API	Local model reads, writes and loading.
List API	Items aggregation and empty-list feedback.
CustomListItem API	The content aggregation and official Samples tab.
SAP binding-context tutorial	Retrieving the selected record's context.
SAPUI5 ID handling	IDs in Views and repeated templates.
SAPUI5 developer best practices	Review app conventions before submission.