SelectWidget (generated from JSON): How to add additional item to the list?

Hello community,

today I was playing around with adding items from a JSON tiddler to the the SelectWidget.
Everything is fine, but I’d like to show a default entry in the list, too. I think this could be done with the prepend-Operator, but I don’t know where it should be inserted (like … prepend[Which item?] …)

Data Tiddler DatJSON-1:

  "0": { 
         "Name": "Fountain Pen",
         "Details": "Green, metallic",
         "Price": 10
  "1": { 
         "Name": "Pencil",
         "Details": "No.2",
         "Price": 1.50
  "2": { 
         "Name": "Ballpoint Pen",
         "Details": "red",
         "Price": 2
  "3": { 
         "Name": "Eraser",
         "Details": "Soft, blue",
         "Price": 2
  "4": { 
         "Name": "Ruler",
         "Details": "20cm, transparent",
         "Price": 2.50


<$list filter="[{!!ItemName}length[]compare:integer:gt[0]then[]]" emptyMessage="Please select item!" /><br>
<$let JSONdata={{{[{DatJSON-1}]}}} >
<$select tiddler=<<currentTiddler>> field="ItemName" >
<$list filter="[<JSONdata>jsonindexes[]]" counter="cntr">
  <$set name="JSONind" filter="[<cntr>subtract[1]]">
  <$let ItemName={{{[<JSONdata>jsonget<JSONind>,[Name]]}}} >
  <$set name="ItemDetails" filter="[<JSONdata>jsonget<JSONind>,[Details]]" >
  <$set name="ItemPrice" filter="[<JSONdata>jsonget<JSONind>,[Price]]" >
<!-- remove items without a price -->
  <$let SelectString="<<ItemName>>" >
  <$list filter="[<ItemPrice>match[]]" emptyMessage="<option><<SelectString>></option>" />

Thank you in advance for your help.

I would do this with an additional option value in the select widget, but outside the list;

<option value="">(clear)</option>
<option value="myval">My val</option>

I don’t use your method to create the option so I often just add another value to the list filter for the options. However you should be able to add one or more options like mine after the select widget is opened <$select tiddler=<<currentTiddler>> field="ItemName" > or just before it is closed </$select>

1 Like

Thank you, @TW_Tones, it works!
I didn’t thought that there is an easy solution and I’m afraid that I still think too complicated when I’m searching for solutions in TW.
Please tell me about your usual way to populate SelectWidgets - this is a chance for me to expand my knowledge.

I really only build on the examples on

  • Not that much different to you, however I try hard to make it easier to read.
$select tiddler=<<qualify 'select-demo'>> default='HelloThere'>
<option value="">(clear)</option>
<$list filter='[all[shadows+tiddlers]tags[]sort[title]]'>
<!-- setting or computing values here -->
<option value=<<currentTiddler>>><$view field='title'/></option>
  • By altering the filter to generate the values I want to select from.
    • It may just generate a list of option values/
  • Setting a tiddler or field as a result (rather than <<qualify 'select-demo'>>)
  • Inside the list I may use additional tiddlywiki script to get alternative values eg remove prefix <!-- setting or computing values here --> as you have.
  • I may replace <<currentTiddler>> or <$view field='title'/> to generate different values or option name.
  • Now I tend to move filters into function definitions.
1 Like

Thanks for the insight.
Most of the time I wasn’t lucky enough to build my snippets upon the examples at Some worked while others don’t because I needed other parameters and didn’t know how to use them the right way. It was a try-and-error procedure.

As an example, when I am using another option-Tag to insert a hint into the select-list (like ‘choose an item’) - as you suggested - it worked out of the box. But there were a detail which I didn’t notice before: Usually, I’m using the select-tag “default” parameter to select the notice showing up as the default selection:

<$select tiddler=<<currentTiddler>> field="ItemName" default="Choose an item" >
<option>Choose an item</option>

But when I’m using the value-parameter of the option-tag, as you suggested, one solution is:

<$select tiddler=<<currentTiddler>> field="ItemName" default="default" >
<option value="default">Choose an item</option>

This was rather easy to solve, but some other issues were not. Thanks to you and all other members of the community I had good help to solve these “problems”, too. But I think I wouldn’t be able to solve these on my own.

I’m afraid that I’m still missing some fundamentals of Tiddlywiki, because I started the wrong way? Picking up examples and trying to connect them altogether didn’t really work for me and I think this isn’t the fault of the documentation.
What do you suggest as a good starting point where I can build up some more connected experience? Is there an ideal way for learning TiddlyWiki from scratch?

It’s hard for me to give an unbiased view having used tiddlywiki for more than a decade - other new commers like Grok TiddlyWiki — Build a deep, lasting understanding of TiddlyWiki

Thank you for your advice.
When I was new to TiddlyWiki, I started with “Grok TiddlyWiki” and I like it. I didn’t finish reading and I think now it’s about time to read it to the end.

I’m using TiddlyWiki for a year now and had very good moments when I thought “this is it, I think I know how things are working here”, but I was wrong. Of course, I can do much more complex tasks than I did in the beginning, but I shouldn’t get cocky - because there is always a bigger problem lurking around the next corner which reminds me that I still have to learn very much.

When it comes to this I am a little bit frustrated, thinking that I didn’t learn anything at all. I’m very glad about the contributors here in this support forum, whithout them I probably had given up already. Thank you to all who helped me!
I was feeling a bit reliefed when you wrote that you use TiddlyWiki for an decade - this gives me hope that not all is lost.
I still have 9 years to get more competent than I am now :blush: :+1:

1 Like

Just keep asking Questions as needed.

1 Like

Thank you.
I certainly will :grinning:

Oh, I may just add here on using the default.

Default is not really for the purpose of a placeholder

  • If you display a default to use when its empty any other code that uses this selection also needs to honor this default, that is even when no value avaiualbe behave as if it had the default value.

This is one reason I said;

For example

<$select tiddler=<<currentTiddler>> field=select-field default={{!!select-field}}>
<option value="">(clear)</option>
<$list filter='[all[shadows+tiddlers]tags[]sort[title]]'>
<!-- setting or computing values here -->
<option value=<<currentTiddler>>><$view field='title'/></option>

See how in the first line I set the field on the current tiddler and the default references that field.

  • Be careful if you use $field= instead field= it will overwrite the current tiddler text
  • Use field=

I may post an update here soon.

1 Like

Thank you for this notice, I really thought that it’s being used as a place-holder, e.g. to notify the user what he should do next.
Very good example, I think I understand now what you tried to explain.

A question regarding the qualify-Makro:
It is of temporary nature, so I can’t use it for storing values longer than until the period when TiddlyWiki is being saved the next time?
What I like is that it generates an unique id and this is what I need sometimes to avoid naming conflicts. But I also need fields for storing values longer, not only until to the next time the Wiki is being saved.
Is there an option to use it not only for generating temporary unique named fields?

The qualify macro itself is not at all temporary in nature and it’s the prefix you give it that determines this <<qualify "$:/temp/name">> this makes it a temp tiddler. You can also use $:/state/name $:/any-system or any tiddler.

  • The qualify macro gets its “unique” number using a position within the code, starting with the current tiddler but also what position you are within nested tiddlywiki script.
  • Unless you store the generated title you can only retrieve the tiddler title from the same position in the script.

One thing you have on your side in the current tiddler is always unique, because only one tiddler can have that title. So if you don’t need more than one title in a tiddler (even then use an alter prefix) just use something like state-tiddler={{{ [<currentTiddler>prefix[$:/state/]] }}} however I have started to use what I call a Ghost or meta tiddler eg meta-tiddler={{{ [<currentTiddler>prefix[$:/meta/]] }}} and use a fieldname for different temp fields wityhin the meta tiddler associated with the current tiddler.

  • Of course you can store a state in a field of the current tiddler if you want, to keep it forever as well.

Have a look in the tiddlywiki code to see how it handles visibility with a set of prefixed tiddlers. See [prefix[$:/config/ViewToolbarButtons/Visibility/]]

There are other approaches that;

  • Assign a unique serial number to any tiddler in a field
  • There is a unique operator that can be used, then store the result.
1 Like

Sorry for my late reply, I didn’t had much time to experiment further.

But I did get some experience with the qualify-macro, also with non-temporary tiddlers.
The meta/ghost-tiddler looks also very interesting and might be a solution for me, too.
This eases my Tiddlywiki-Life, thank you for the hint.