Simple checklist macro

As I’ve been working on my TiddlyWiki fluency, I sometimes yearned for a simple checklist macro for small lists. I use my own homegrown Getting Things Done system in TiddlyWiki (a potential topic for a future post!), but it’s nice to have a little checklist for packing lists or other small sets of tasks. Enter $:/phajas/macros/checklist:

$__phajas_macros_checklist.json (974 Bytes)

Drag this into a TiddlyWiki, and try to use it like this in a Tiddler:

<<checklist>>

You’ll get a simple checklist with an input field and add button. It was fun learning about the $keyboard widget to enable rapid entering of checklist items. It uses the checked, checklist, and inflight-checklist-input fields on the tiddler embedding the macro.

2 Likes

Nice, simple, elegant. Although I have others already in use, I would prefer this one to not have the extra line between, easy to change.

Thanks for sharing to the community.

Hi Peter,

I think you have added unnecessary complexity to your code. The below works

\define add-item()
<$action-listops $field="checklist" $subfilter="[{!!inflight-checklist-input}]" />
<$action-deletefield $field="inflight-checklist-input"/>
<$action-sendmessage $message="tm-focus-selector" $param=".ChecklistInput"/>
\end

\define short-checklist()
<$keyboard key="enter" actions=<<add-item>> >
<$edit-text class="ChecklistInput" field="inflight-checklist-input"/>
</$keyboard>
<$button actions=<<add-item>> >Add</$button>

<$list filter="[list[!!checklist]]" variable=item>
<$checkbox listField="checked" checked=<<item>> >
<<item>>
</$checkbox><br/>
</$list>
\end

I renamed the checklist to short-checklist

You can learn from Kara in kookma plugin library.

2 Likes

Nice little hack for both of your codes.
But, if you edit the tiddler containing the checklist, all selections are cleared. Checked items do not seem to be saved somewhere in the wiki.

I don’t think so. The cheklist is stored in a field and as far as you keep that field, checklist works.

If you like to store the items in another tiddler say mychecklist-tiddler call macro like this.

<$tiddler tiddler="mychecklist-tiddler">

<<short-checklist>>
</$tiddler>

This is really cool, though I do have one question
Is there a way to create a btn to remove an item? I’m not sure how to target a specific segment of text within a field unfortunately

This is a KISS solution, but you can use css and use better filters.
Change your $list widget as below

<$list filter="[list[!!checklist]]" variable=item>
<$button class="tc-btn-invisible">{{$:/core/images/delete-button}}
<$action-listops $field="checklist" $subfilter="-[<item>]"/>
<$action-listops $field="checked" $subfilter="-[<item>]"/>
</$button>
<$checkbox listField="checked" checked=<<item>> >
<<item>>
</$checkbox><br/>
</$list>
1 Like

That works perfectly, honestly

I like this.

For those that want to show active and completed, here is the same code with more separation between checked and unchecked

\define add-item()
<$action-listops $field="checklist" $subfilter="[{!!inflight-checklist-input}]" />
<$action-deletefield $field="inflight-checklist-input"/>
<$action-sendmessage $message="tm-focus-selector" $param=".ChecklistInput"/>
\end

\define delete-item()
<$action-listops $field="checklist" $subfilter="-[<item>]"/>
<$action-listops $field="checked" $subfilter="-[<item>]"/>
\end

\define check-item()
<$action-listops $field="checked" $subfilter="[<item>]" />
<$action-listops $field="checklist" $subfilter="-[<item>]"/>
\end

\define uncheck-item()
<$action-listops $field="checklist" $subfilter="[<item>]" />
<$action-listops $field="checked" $subfilter="-[<item>]"/>
\end

\define checklist()
<$keyboard key="enter" actions=<<add-item>> >
<$edit-text class="ChecklistInput" field="inflight-checklist-input"/>
</$keyboard>
<$button actions=<<add-item>> >Add</$button>

<$list filter="[all[current]has[checklist]]">
__Active__<br/>
<$list filter="[list[!!checklist]]" variable=item>
<$button class="tc-btn-invisible" actions=<<delete-item>>>{{$:/core/images/delete-button}}</$button>
<$checkbox listField="checked" checked=<<item>> checkactions=<<check-item>> >
<<item>>
</$checkbox><br/>
</$list>
</$list>

<$list filter="[all[current]has[checklist]has[checked]]">
<hr/>
</$list>
<$list filter="[all[current]has[checked]]">
__Completed__<br/>
<$list filter="[list[!!checked]]" variable=item>
<$button class="tc-btn-invisible" actions=<<delete-item>>>{{$:/core/images/delete-button}}</$button>
<$checkbox listField="checked" checked=<<item>> uncheckactions=<<uncheck-item>> >
~~<<item>>~~
</$checkbox><br/>
</$list>
</$list>
\end
2 Likes