Is there a way to use a checkbox within a table cell? I tried the solutions here but can’t get it to work.
No it’s not possible due to a limitation of the underlying Markdown renderer.
I’m trying to use Joplin as a digital bullet journal as shown here. Another thing I was trying to do was to have multiple checkboxes on a single line, but it seems like that isn’t possible either.
Is it not possible to use html for checkboxes? <input type="checkbox"> doesn’t seem to work, it just shows a text input box.
Never mind. <input type="checkbox"> does work. The problem was that I must have copy and pasted it from the web and used left and right double quotes instead of regular double quotes: <input type=“checkbox”>.
Edit: While the html checkbox works, the checked property doesn’t get saved. Guess I’ll have to look at other software options for a digital bullet journal.
I am starting digitizing my BuJo in Joplin. I think the best way for keys and signifiers is using emojis and keyboard. For example:
Main keys and modifiers:
| Key | Meaning |
|---|---|
| ☐ | task incomplete |
☑ |
task completed |
| ☒ | task cancelled |
| ◪ | task in progress |
◀ or < |
task scheduled in future log |
▶ or > |
task migrated to collection |
| O | event |
| ⊗ | event cancelled |
| ◑ | event in progress |
| ⓘ | info/note |
Signifiers:
| Key | Meaning |
|---|---|
| ? | Question |
| ❛ | Quote |
| ⟲ | Recurring |
| ⚹ | Important |
| ◆ | Milestone |
👁🗨, 👁, 👀, or 👓 |
explore more |
♡ |
Enthusiastic about |
💡 |
Idea |
🔗 or ∞ |
Link to |
5 Likes
Here’s my checkbox adventure. Setting up my family tree in December, I tried to mix a checklist with an unordered list as in this simplified example:
- **Gerard**
- [x] Hendrik
- [ ] Izaäk
- [ ] **Johannes**
- Karel
- Lodewijk
Gerard is dead, and does not need a checkbox anymore. Karel and Lodewijk are too young for a checkbox.
The indentation in the viewer was a mess and irreparable. I was about to propose a self-contained checkbox — to be evoked with ?[ ] or whatever — anywhere in a Markdown paragraph, list, or table, when I understood that it’s “a bridge to far” at the moment. I don’t totally give up all hope (the Rhine was crossed, eventually), but it won’t happen in 2020, I guess.
So how to make do with checkboxes that don’t feed back to the Markdown document? To prevent false expectations in the viewer, I avoid the <input> tag for this. The most simple and typist-friendly solution would be the left one below.
In Markdown:
- **Gerard**
- `[x]` Hendrik
- `[ ]` Izaäk
- `[ ]` **Johannes**
- Karel
- Lodewijk
If you want something more fancy in the viewer, you have a lot of options. The second list is one of my favorites.
<style>
chk- {
border-radius: .25em;
background-color: #E4E4E4;
color: #0269C2;
font-family: IBM Plex Mono;
font-size: 95%;
font-weight: bolder;
padding: 0 .32em;
white-space: pre;
}
</style>
- **Gerard**
- <chk->✓</chk-> Hendrik
- <chk-> </chk-> Izaäk
- <chk-> </chk-> **Johannes**
- Karel
- Lodewijk
It makes use of cheating techniques as I’ve mentioned here. In this case I use just one false HTML tag to define a checkbox. My most favorite layout however is the list at the right side, that needs four false tags and a lot of CSS:
<style>
bl- {
position: relative;
left: -1.7em;
}
bl- li {
list-style-type: none;
}
b---::before, o---::before, x---::before {
border-radius: .25em;
font-weight: bolder;
content: "✓";
padding: 0 .2em;
margin-right: .25em;
}
b---::before {
position: relative;
top: -.8em;
border: 2px solid #999999;
border-radius: 8em;
color: transparent;
font-size: 30%;
line-height: 90%;
margin: 0 1.9em 0 .9em;
}
o---::before {
background-color: #E4E4E4;
color: #E4E4E4;
font-size: 105%;
}
x---::before {
background-color: #E4E4E4;
color: #0269C2;
font-size: 105%;
}
</style>
<bl->
- <b---/> **Gerard**
- <x---/> Hendrik
- <o---/> Izaäk
- <o---/> **Johannes**
- <b---/> Karel
- <b---/> Lodewijk
</bl->
The possibly font-dependent CSS metrics are good for a strong headache. Logic and arithmetic didn’t suffice for me, a lot trial and error was involved to get everything positioned as I wanted. Moreover, I also needed some corrections (not shown here) for tables, because I had reduced their font size to 90%. The checking/unchecking process, on the other hand, is rather comfortable: the checkboxes are easily spotted in the Markdown text, and only one character has to be changed to check or uncheck the box.
Last Monday, after a few months, I picked up my writing of a ‘testament’ for my successors again. This time I used Joplin for note-taking, as an experiment. I created an annotated outline as an ordered list, and two tables of software components and their grouping. All three with the homebaked checkboxes of the third kind. And I can testify now from my own experience: once the style definitions are settled, it’s quite workable. Although that doesn’t smother my ardent desire for a real self-contained checkbox with feedback.
3 Likes
if that works, a option to insert custom CSS per note, would be helpful, wouldn't it?
That could and up in kind of theme plug-in model 
1 Like
I know that block-level elements are not supposed to be inserted into GFM-flavored MD table cells. But I found the following MD code to work just fine in Joplin :
|AAA|BBB|CCC|
|---|---|---|
|ddd|eee|fff|
|ggg|- [ ] hhh|kkk\
||- [x] iii|\
||- [ ] jjj|
|lll|mmm|nnn|
Result :
Any reason NOT to do that ?
3 Likes