SelectWidget Option - Maintain whitespace

Is there anyway to have SelectWidget option preserve spacing?

I am generating the options by combining two variables with padding on the first so the second lines up, however in the dropdown the spacing is not maintained.

python code

myPrint(f'<option>{playerName : <21} - {playerProf}</option>')


<option>Arbus Law             - Firebrand</option>
<option>Sossal                - Harbinger</option>
<option>Saltyer               - Reaper</option>
<option>Drevarr Moonwillow    - Scrapper</option>

Displays as

I imagine you’ll want to pad with non-breaking spaces (&nbsp;) rather than normal spaces. As a wikitext example of the kind of approach I’d use:

<$select field=test>
<$list filter="[tag[HelloThere]pad:suffix[50],[ ]addsuffix[test]]">
<option style="font-family: Courier">{{!!title}}</option>


That’s a non-breaking space in pad:suffix[50],[ ], so you can copy and paste it.

You will need to use a monospace font for things to line up properly—ideally, defined in an external stylesheet tiddler and applied via a class on the select widget.


Thank you!!     

So you realy want the stored result to include the padding? See the select widget example and set the value differently from the option display.

Here I only save the “tag name” not the modified and padded value.

<$select field=test default={{!!test}}>
<$list filter="[tag[HelloThere]]">
<option value=<<currentTiddler>> style="font-family: Courier" ><$text text={{{ [<currentTiddler>pad:suffix[50],[ ]addsuffix[test]] }}}/></option>

However I like to make the code easier to read with functions.

\function selection() [<currentTiddler>pad:suffix[50],[ ]addsuffix[test]join[]]

<$select field=test>
<$list filter="[tag[HelloThere]]">
<option value=<<currentTiddler>> style="font-family: Courier"><<selection>></option>

Here’s a fully fleshed-out solution that combines the methods used by @etardiff and @TW_Tones with the desired goals as stated by

\function item() [{!!title}pad:suffix<maxlength>,<space>] [{!!title}get[playerprof]] +[join[ - ]]

<$let space={{{ [charcode[160]] }}} maxlength={{{ [tag[player]length[]nsort[]last[]] }}}>
<$select field=test>
   <$list filter="[tag[player]]">
      <option style="font-family:monospace" value={{!!title}}><<item>></option>


  • Player names are titles of individual tiddlers, each tagged with player
  • Player professions are stored in the playerprof field of each player tiddler
  • space is an ASCII character using the decimal code for a non-breakable space (=160)
  • maxlength is the number of characters in the longest player name. This is used to determine the amount of padding to add to each list item
  • <<item>> is a function (filter syntax) that constructs each list item display text from the player name padded with non-breakable spaces and the corresponding player profession, joined with a dash ("-")
  • font-family:monospace uses a platform-independent fixed-width font name (“monospace”) rather than the Windows-specific “Courier” font name.
  • <option...> uses value={{!!title}} so that the target field value is just the selected tiddler title, without the additional display formatting.



Thanks for this tidbit