Show table of checkboxes with labels based off a DataTiddler

[David]

Summary:

I'd like to have a list of checkboxes, for a grocery list, that pull data from a DataTiddler.

Detail:

I have items I shop for every week and I thought I'd create a tiddler to allow me to uncheck and check items as I shopped. 

• I'd like the state of the checkboxes to be stored somehow, I'm not picky where.  Simpler may be better.
• I'd like it to pull the list of items from a DataTiddler.  I think separating the display code from the data would be nice, and I can also learn about DataTiddlers at the same time.  I'm thinking I don't care if the state of each checkbox is stored in the DataTiddler or in the tiddler with the logic.  I guess ideally it would be in the DataTiddler, but at this point if it is simpler I don't have to.  I have an example where the state of each box is stored in the logic tiddler's field, which works.
• If the data could be stored in more of a CSV style, that would be nice as well, but not essential.
  

I've done a good bit of searching on DataTiddlers and indexes and have found some help, but not a lot.  Here's some code that gives me what I want, but obviously I'd rather not have to add more checkbox commands for each new item I put in the dataTiddler.  I know I can loop over this somehow, right?

But I was unable to find how to successfully loop over the keys in a Dictionary Tiddler.

This works, but is not dynamic...

<$checkbox field="item1" checked='val1'>{{ShoppingSamsClubData##item_01}}</$checkbox>

<$checkbox field="item2" checked='val2'>{{ShoppingSamsClubData##item_02}}</$checkbox>

And here are the contents of the data tiddler....

item_01: Rice
item_02: Milk 

type: application/x-tiddler-dictionary

[Mark S.]

I think newcomers sometimes gravitate towards the data tiddler, because it seems familiar. But really, the main data element in TW isn't the data tiddler, which are pretty limited, but the tiddler themselves. The problem with using a data tiddler is that it will record a single bit of information for each item. Like "buy/don't buy". But what if you have one item that you can get from two different places? Or if you want to indicate what kind of product it its (produce, hardware, canned, cleaning, etc.) ?

The best thing to learn is the list widget, and the filters it uses.

I use a TW grocery list every week. I suppose I should sanitize it and post a version. I haven't kept it up to 5.1.20 capabilities ... but sometimes "good enough" is the enemy of "perfect."

Ok, back to your question.

Let's say you have a data tiddler like:

ShoppingSamsClubData

with

Aardvarks: yes

Kittens: no
Puppies: yes

Then in a tiddler you can put:

<$tiddler tiddler="ShoppingSamsClubData">
<$list filter="[all[current]indexes[]sort[]]" variable=item>
<$checkbox index=<<item>> checked="yes" unchecked="no"/> <<item>><br/>
</$list>
</$tiddler>


And it will give you a dynamic list like (you should see a screen shot here):

I guess if all you ever want is to shop at Sam's club, then you're good to go!

HTH

[David]

I would love to learn more about the ListWidget.  I looked at that main page and it was just too complicated for me at this point.  I'm a programmer, but a TW noob.

[Mat]

David wrote:

I would love to learn more about the ListWidget.  I looked at that main page and it was just too complicated for me at this point.  I'm a programmer, but a TW noob.

David, you must learn to use the listwidget. It is probably the most central widget of them all for creating stuff. I'd say 80-90% of everything I make in TW centers around the listwidget. If you're a programmer... you'll get it quickly once you actually play around with it. In fact, what I think you mean is difficult is really the filter attribute. Yes, filters can take some getting used to... but they are central for the listwidget so, them too, you must ;-)

<:-)

[TonyM]

David,

Herre is a little code from and existing solution I built

The fieldnames are extracted from the data tiddler and a list of only those "checked" is displayed in read only view, in edit view a checkbox is presented for all fieldnames.

This is read only/view

<$list filter="[[$:/data/industry-experience-fields]indexes[]]" variable=fieldname>
    <$list filter="[all[current]get<fieldname>match[yes]]" variable=nul>
       <$text text={{{ [[$:/data/industry-experience-fields]getindex<fieldname>] }}}/><br>
    </$list>
</$list>

This is edit or checkbox mode

<$list filter="[[$:/data/industry-experience-fields]indexes[]]" variable=fieldname>
  <$checkbox field=<<fieldname>>  checked="yes" unchecked="no" default="no"> <$text text={{{ [[$:/data/industry-experience-fields]getindex<fieldname>] }}}/></$checkbox><br>
</$list>

Regards

Tony

[David]

Mark,

So would each tiddler become like a row in a database table?

And would the columns of that row be colon separated values like a data tiddler?  Example:

Tiddler Name: $:/data/ShoppingItems/Milk

Tiddler content:

buyItThisWeek: yes

recurringWeeklyItem: yes

storeSection: Dairy

atSamsClub: yes

atLidl: yes

And then could you throw together some code to give me a list of all the "data" tiddlers with a prefix of "$:/data/ShoppingItems/" that have a "buyItThisWeek" value of "yes"? 

And bonus points for having the list sorted by store section.

I think that would lay down a nice groundwork for me to build on and use as a pattern as I study the listWidget.

Thanks so much if you can!

On Monday, March 16, 2020 at 12:49:07 PM UTC-4, Mark S. wrote:

[Mat]

@David, maybe not exactly what you describe in your post to Mark but it should work as an exampe to study the ListWidget: fields2table.

<:-) 

[Mark S.]

I've used a slightly different structure, to leverage the tag and list fields.

Grocery tiddlers are tagged with "Item", and have the following special fields:

tags: (one or more of) Item Selected

sections: (field indicating the section where the item can be found)

retailers: (list field with retailers)

An item tagged with "Item" is a grocery/shopping item. An item also tagged with "Selected" is selected for the current shopping list / week. Items tagged "Recurring" will appear on the recurring list.

There is a special tiddler Retailers that has a list of all retailers in its list field.

There is a special tiddler Sections that has a list of all sections in its list field.

A view template helps you select or remove retailers.

There is a lister tiddler that lists your items, as you asked. Here is a screenshot:

The attached contains the starter kit. Back up any work you have started. Or better yet, use a fresh empty TW file. Download the attached. Drag and drop into your TW file (a green bar should appear at the top). Import the tiddlers. There are many improvements that could be made. For instance, making each item in the grocery list a link might be useful.

It's left as an exercise to add "sections" to the grocery view template.

I should probably post this in it's own TW page somewhere.

[Mark S.]

https://marxsal.github.io/various/groceries.html

[David]

Oh, that is good, man!  Perfect!

Thanks!

On Thursday, March 19, 2020 at 4:36:25 PM UTC-4, Mark S. wrote:

https://marxsal.github.io/various/groceries.html

[David]

This is great, but if I may offer one change so that your example could be more easily graspable by noobs like me....  you used the string "section" to represent two different things.  It's a field in the data tiddlers as well as your item iterator variable in the section loop.

when I started to switch over your code to my data paradigm, It took me several hours of working with your code and googling (there's not a lot of noob-friendly info out there that's easy to find) to discover that. 

The good news is I learned a lot.  And I've also had a lot of fun putting together my own Grocery lister, and I was easily able to start a new set of Data Tiddlers and another lister for my TODO tasks as well, sectioning them by the context in which the task should be done (e.g. home, office hours, or out and about).

I saw how you set "sections" up as a tiddler, containing the names of the sections.  It would be great if there were a dynamic way to get a list of the sections.  For my grocery list, they are all tagged with "ShoppingItem".  Is there a way to create that list by searching all the tiddlers tagged "ShoppingItem" and grab the different values in their "section" field dynamically?

This has been so helpful!

Thank you!

[Mark S.]

On Sunday, March 22, 2020 at 7:01:19 AM UTC-7, David wrote:

I saw how you set "sections" up as a tiddler, containing the names of the sections.  It would be great if there were a dynamic way to get a list of the sections.  For my grocery list, they are all tagged with "ShoppingItem".  Is there a way to create that list by searching all the tiddlers tagged "ShoppingItem" and grab the different values in their "section" field dynamically?

You could do this with a nested <$list> structure.

The reason, or one of the reasons, I didn't do it this way to avoid the problem that happens when you let people set up "sections" (or any data attribute) on the fly. You tend to end up with either too many "sections", or "sections" with different values (spellings, misspellings, plurals, etc.) but for the same thing. e.g.

Garden

Gardeen

Gardening

Gardens

gardens

OutdoorGarden

Yardwork

Having one central location for the sections helps you to think clearly about what values you want "sections" to contain. Then the drop-down list allows you to easily select and apply that section to new items. If you really want more sections then it's easy enough to add them to the driver tiddler. Believe me, if you've ever inherited a database where someone has freely entered anything they happened to be thinking of at 9am on a Monday morning, then you'll know what I'm talking about.

[David]

Yes, I've definitely run into that kind of problem before.

But in the case of a TODO list, I would rather have a data entry error show up under another category, instead of not showing up at all.  If I put in a TODO Task and did it quickly without checking to make sure it showed up, I could then disappear if I didn't categorize it correctly.

I would then later spot it under the wrong category and then correct it.

Or I guess if we kept to the static list, we could add some kind of exclusion to pick up the strays and put them at the bottom of the list under a section with a title like "Miscategorized" or something like that.

[scot]

Hello Mark S.

Thanks very much for posting your example online.

I would like to modify it, but I'm not sure how to do it, to achieve what I would like.

Is it possible to show a list of Items by Section, but only show the section and item, where the items have been selcted.

My example below, shows Sections with no Items which are not required.

Any help you could offer would be much appreciated.

Scot

[Mark S.]

I've just updated the grocery list showing how this might be done.

The problem with not showing empty sections is then, how do you get them back? So I've put in a select list that lets you choose whether to show empty sections or not.

Probably I will also add a select option whether to show individual items, checked items, unchecked items, or recurring items. I will probably put the "sections" and "Retailer" in their own tiddlers. After this, the "recurring" section will no longer be needed, because you'll be able to select within the "Sections" list.

There will probably also be an ability to turn off the "real" checkboxes and swap in text-based boxes (e.g.[_] Razor Wire) so that the text can be copied and pasted into a word processor. This process is what I do in my actual grocery list app (which is outdated).

HTH

[Mohammad]

The link is added to TW-Scripts

[scot]

Mark S.

Thanks Mark for updating the grocery List. Just what I needed.

I had added lists in tabs. I like your drop-down menus though.

See my version in the attached file, just for comparison - incomplete.

Best Regards,

Scot