&nbsp;

&nbsp;
<h3>Loading and saving data</h3>
<form data-bind="submit: addTask">Add task: <input type="text" placeholder="What needs to be done?" data-bind="value: newTaskText" />
<button type="submit">Add</button></form>
<ul data-bind="foreach: tasks, visible: tasks().length &gt; 0">
 	<li><input type="checkbox" data-bind="checked: isDone" />
<input type="text" data-bind="value: title, disable: isDone" />
<a href="#" data-bind="click: $parent.removeTask">Delete</a></li>
</ul>
You have <b data-bind="text: incompleteTasks().length"> </b> incomplete task(s)
<span data-bind="visible: incompleteTasks().length == 0"> - it's beer time!</span>



&nbsp;