Deleting a task

The second feature of our to-do application is to give the users the ability to delete a task. We will do this by adding an Actions column to our tasks table and providing a Delete button for each task in the Actions column. The task will be removed from the tasks array when the Delete button for that task is clicked upon.

Add the Actions column to the tasks table by adding the column header to the thead element:

<th>Actions</th>

Add this code after <th>Description</th>. Now add the column body with a button for deleting the task. The new column goes after the Description column. It should look similar to the following code:

<td><button class="btn btn-danger" data-bind="click: ToDoList.deleteTask">Delete</button></td>

The preceding ...

Get KnockoutJS by Example now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.