this post follows on from Create a simple TiddlyWiki Page

Create some tasks

• create a task called Take out the garbage
• add a tagname of Tasks

Edit ToDo to show all current Tasks

• edit the ToDo tiddler with the following code

<$list filter="[tag[task]]">
<$view field="title"/>
</$list>

now we want to filter the task list to filter out all draft documents that have not been saved

<$list filter="[!has[draft.of]tag[task]]">
<$view field="title"/>
</$list>

finally we want to remove all done tasks and sort the tasks by created date

<$list filter="[!has[draft.of]tag[task]!tag[done]sort[created]]">
<$view field="title"/>
</$list>

• save this and we get

Now we want to make our tasks clickable – so we need to create a link.

<$list filter="[!has[draft.of]tag[task]!tag[done]sort[created]]">
<$link to={{!!title}}>
<$view field="title"/>
</$link>
</$list>

This gives us the following tiddler, and we can click on the link to open Take out the garbage.

Now we want to add a created date and done checkbox to our tasks

<$list filter="[!has[draft.of]tag[task]!tag[done]sort[created]]">
<$checkbox tag="done">
 <$link to={{!!title}}>
<$view field="created" format="date" template="DDD 0DD/MM/YY : hh:mm"/>
 - <$view field="title"/>
</$link>
</$checkbox>
</$list>

Now we have the following

and if we check the checkbox, the done tag is added to Take out the garbage and it disappears from our ToDo list

Edit Completed to show all done Tasks

• edit the Completed tiddler

<$list filter="[!has[draft.of]tag[done]sort[created]]">
<$checkbox tag="done">
 <$link to={{!!title}}>
<$view field="title"/>
</$link>
</$checkbox>
</$list>

Now we want to add the created date to the completed task

<$list filter="[!has[draft.of]tag[done]sort[created]]">
<$checkbox tag="done">
 ~~<$link to={{!!title}}>
<$view field="created" format="date" template="DDD 0DD/MM/YY : hh:mm"/>
 - <$view field="title"/>
</$link>~~
</$checkbox>
</$list>

By checking and unchecking our task we can move it from ToDo to Completed and back again.

next: add markup to our TiddlyWiki page