Shiraz Dynamic Table plugin - column captions, and tbl-column-list

[NickB]

Hi @Mohammad

1. How do I set the caption for one or more columns? I think as it stands the each field name is rendered in PascalCase. Does it require the use of a column template?
2. To apply a column template, it must be tagged with $:/tags/Table/BodyTemplate and also critically the field name to which the column template applies should be specified in the tbl-column-list field. Unfortunately tbl-column-list isn’t mentioned in any documentation I can find - could this be addressed please? I stumbled across this field in a post on this forum otherwise I would have been none the wiser

Thank you

Nick

[Mohammad]

Hi Nick,
Yes, the column caption is the name of field and converted to Titlecase like myfield→ Myfield
I did not notice the custom template creation has been deleted in recent docs. I think there was instruction for this. I will look and fix it!

There are some examples in this forum for creating custom template, but in general

• templates/body → control column content
• templates/header→ control column header
• templates/footer→ control column footer

In any template the field tbl-column-list is a key field to control which field is shown through this template.

The simple way is to clone an existing template!

[NickB]

Thanks Mohammad, I understand that everything is conflgurable via templates, but I was wondering whether something as commonly required as setting the caption for a field in a table might be made a little easier?

Am I correct in saying that currently, to set a custom caption for a field, you have to create both custom /body and /header templates and tbl-column-list to a new pseudo-field name which is specified in the fields list in the table-dynamic macro?

I think some sort of override might be possible - I will have a ponder

[NickB]

OK @Mohammad I’ve got custom captions to work thuswise:

1. Create an application/json tiddler with mappings from field names to desired caption:

{
 "fieldName1": { "Caption": "My nice newish caption" },
 "fieldName2": { "Caption": "My horrible caption" }
}

2. Clone $:/plugins/kookma/shiraz/templates/header/default to e.g. $:/njb/plugins/kookma/shiraz/templates/header/default, set tag $:/tags/Table/HeaderTemplate and move list order to top.

3. Wrap the contents of . $:/njb/plugins/kookma/shiraz/templates/header/default in the following:

<$set name=currentColumn value={{{[{Dynamic table columns}jsonextract<currentColumn>jsonget[Caption]else<currentColumn>]}}}>

4. Make sure that the mysterious, undocumented tbl-column-list field includes the desired fieldNames

5. Make the macro call as usual e.g.

<$macrocall $name=table-dynamic fields="fieldName1" filter="[tag[Review]]"/>

It all works fine, and is relatively simple but seems like a lot of work and column sorting doesn’t work.

Any thoughts on a better way of doing this? I thought it would be nice to specify the name and desired caption in the tbl-column-list e.g. by passing fields like this:

[realFieldName2[Desired caption 😄]] [realFieldName3[Desired caption 😢]]
Thanks

Nick

[NickB]

The alternative being skipping all the json, cloning the header template and hacking as below:

<$let caption="Clinic date">
<$reveal type=nomatch stateTitle=<<tempTableSort>>stateIndex=sortIndex text=<<currentColumn>>tag=th>
<$button setTitle=<<tempTableSort>>setTo=<<currentColumn>>class="tc-btn-invisible tc-tiddlylink"setIndex=sortIndex>
<$action-setfield $tiddler=<<tempTableSort>>$index=hasnegate $value=false/>
<$action-setfield $tiddler=<<tempTableSort>>$value=""$index=negate/>
<<caption>>
</$button>
</$reveal>
<$reveal type=match stateTitle=<<tempTableSort>>stateIndex=sortIndex text=<<currentColumn>>tag=th>
<$list filter="[<tempTableSort>getindex[hasnegate]match[false]]"variable=ignore>
<$button setTitle=<<tempTableSort>>setIndex=hasnegate class="tbl-sort-svg tc-btn-invisible tc-tiddlylink"setTo>
<$action-setfield $tiddler=<<tempTableSort>>$index=negate $value=!/>
<<caption>> {{$:/core/images/down-arrow}}
</$button>
</$list>
<$list filter="[<tempTableSort>getindex[hasnegate]match[true]]"variable=ignore>
<$button setTitle=<<tempTableSort>>setIndex=hasnegate class="tbl-sort-svg tc-btn-invisible tc-tiddlylink"setTo=false>
<$action-setfield $tiddler=<<tempTableSort>>$value=""$index=negate/>
<<caption>> {{$:/core/images/up-arrow}}
</$button>
</$list>
</$reveal>
</$let>

[NickB]

My condolences to those following along.

Easiest way (so far) is:

1. Insert the contents of $:/plugins/kookma/shiraz/templates/header/default somewhere ‘local’, wrapped in a macro (here headerCaptionMacro) definition with a parameter (desiredCaption here) for the desired caption somewhere conventient, tagging with $:/tags/Macro:

\define headerCaptionMacro(desiredCaption)
<$reveal type="nomatch" stateTitle=<<tempTableSort>> stateIndex="sortIndex" text=<<currentColumn>> tag="th">
<$button setTitle=<<tempTableSort>> setIndex="sortIndex" setTo=<<currentColumn>> class="tc-btn-invisible tc-tiddlylink" >
<$action-setfield $tiddler=<<tempTableSort>> $index="hasnegate" $value="false"/>
<$action-setfield $tiddler=<<tempTableSort>> $index="negate" $value=""/>
$desiredCaption$
</$button>
</$reveal>
<$reveal type="match" stateTitle=<<tempTableSort>> stateIndex="sortIndex" text=<<currentColumn>> tag="th">
<$list filter="[<tempTableSort>getindex[hasnegate]match[false]]" variable=ignore><!--set negate for sort-->
<$button setTitle=<<tempTableSort>> setIndex="hasnegate" setTo="true" class="tbl-sort-svg tc-btn-invisible tc-tiddlylink" >
<$action-setfield $tiddler=<<tempTableSort>> $index="negate" $value="!"/>
$desiredCaption$ {{$:/core/images/down-arrow}}
</$button>
</$list>
<$list filter="[<tempTableSort>getindex[hasnegate]match[true]]" variable=ignore><!--remove negate for sort-->
<$button setTitle=<<tempTableSort>> setIndex="hasnegate" setTo="false" class="tbl-sort-svg tc-btn-invisible tc-tiddlylink" >
<$action-setfield $tiddler=<<tempTableSort>> $index="negate" $value=""/>
$desiredCaption$ {{$:/core/images/up-arrow}}
</$button>
</$list>
</$reveal>
\end

2. Create a tiddler containing the macro call like so <<headerCaptionMacro "Clinic date">> with the $:/tags/Table/HeaderTemplate tag and the tbl-column-list field set to the name of the field you wish to be handled.
3. Profit.

[Springer]

Why would it not be possible to adjust the tiddler named:

$:/plugins/kookma/shiraz/templates/header/default

by changing the lines with this code:

<span style="text-transform: capitalize;"><$text text=<<currentColumn>>/></span>

so that they look for a caption field in the tiddler for the current column, and uses that caption if it exists, defaulting to the title if the caption field does not exist?

-Springer

[NickB]

Hmm, what do you mean by “the tiddler for the current column”?

I guess it would be easy to create mapping tiddlers like $:/njb/mappings/ClinicDate which contain caption (and other) fields.

Thanks @Springer

[Springer]

You can make a tiddler titled the way the field name is titled (assuming your dynamic-table columns are fields). Then, create a caption field within that tiddler.

Of course, second-guessing my quick reply above, caption might not be the best choice for a field to determine the dynamic table header, since other functions already harness the caption field. Perhaps tbl_caption or something like that would be better. (I often prefer very short headers for columns if the data is short, so that horizontal space is not wasted. But some fields, like bibtex-year, are baked into other plugins, and take more horizontal space than the contents within the column below.)

-Springer

[Springer]

Nick,

Spelling out the solution merely gestured-at above:

Suppose I have a dynamic-table column for the bibtex-year field, and I always want the dynamic-table column’s header to be just year (which I do!) … or 📘year or whatever.

On my solution: I make a tiddler called bibtex-year and give it a tbl_caption field with contents: year.

I can do this, on the fly, for any column header, without messing around each time with templates. Column headers still default to their usual field names.

If you like this behavior, you just have to edit Shiraz’s shadow tiddler for default column headers as follows:

title: $:/plugins/kookma/shiraz/templates/header/default

<$reveal type="nomatch" stateTitle=<<tempTableSort>> stateIndex="sortIndex" text=<<currentColumn>> tag="th">
<$button setTitle=<<tempTableSort>> setIndex="sortIndex" setTo=<<currentColumn>> class="tc-btn-invisible tc-tiddlylink" >
<$action-setfield $tiddler=<<tempTableSort>> $index="hasnegate" $value="false"/>
<$action-setfield $tiddler=<<tempTableSort>> $index="negate" $value=""/>
<span style="text-transform: capitalize;"><$transclude tiddler=<<currentColumn>> field="tbl_caption"> <<currentColumn>> </$transclude></span>
</$button>
</$reveal>
<$reveal type="match" stateTitle=<<tempTableSort>> stateIndex="sortIndex" text=<<currentColumn>> tag="th">
<$list filter="[<tempTableSort>getindex[hasnegate]match[false]]" variable=ignore><!--set negate for sort-->
<$button setTitle=<<tempTableSort>> setIndex="hasnegate" setTo="true" class="tbl-sort-svg tc-btn-invisible tc-tiddlylink" >
<$action-setfield $tiddler=<<tempTableSort>> $index="negate" $value="!"/>
<span style="text-transform: capitalize;"><$transclude tiddler=<<currentColumn>> field="tbl_caption"> <<currentColumn>> </$transclude></span> {{$:/core/images/down-arrow}}
</$button>
</$list>
<$list filter="[<tempTableSort>getindex[hasnegate]match[true]]" variable=ignore><!--remove negate for sort-->
<$button setTitle=<<tempTableSort>> setIndex="hasnegate" setTo="false" class="tbl-sort-svg tc-btn-invisible tc-tiddlylink" >
<$action-setfield $tiddler=<<tempTableSort>> $index="negate" $value=""/>
<span style="text-transform: capitalize;"><$transclude tiddler=<<currentColumn>> field="tbl_caption"> <<currentColumn>> </$transclude></span> {{$:/core/images/up-arrow}}
</$button>
</$list>
</$reveal>

To be clearer (so that the suggestion survives Shiraz updates) just replace each occurrence of

<span style="text-transform: capitalize;"><$text text=<<currentColumn>>/></span>

with

<span style="text-transform: capitalize;"><$transclude tiddler=<<currentColumn>> field="tbl_caption"> <<currentColumn>> </$transclude></span>

[NickB]

@Springer

To be clearer (so that the suggestion survives Shiraz updates) just replace each occurrence of

<span style="text-transform: capitalize;"><$text text=<<currentColumn>>/></span>

with

<span style="text-transform: capitalize;"><$transclude tiddler=<<currentColumn>> field="tbl_caption"> <<currentColumn>> </$transclude></span>

Thank you @Springer, lots of good stuff there!

I have gone with:

1. “caption tiddlers” in any convenient location tagged with $:/njb/tags/ColumnCaption, title is field name, tbl_caption is desired caption
2. $:/plugins/kookma/shiraz/templates/header/default overridden (I had thought that I could do this by cloning to a $:/njb/… tiddler and tagging with $:/plugins/kookma/shiraz/templates/header/default, moving this tiddler’s tag position to the top of the list, but this didn’t work ). Content:
   • <span style="text-transform: capitalize;"><$text text=<<currentColumn>>/></span> replaced by <<caption>>
   • Code added to top of $:/plugins/kookma/shiraz/templates/header/default:

\define ff() [<currentTiddler>get[title]split[/]last[]match<currentColumn>]
\define caption() {{{ [tag[$:/njb/tags/ColumnCaption]filter<ff>get[tbl_caption]else<currentColumn>] }}}

This should make edits when $:/plugins/kookma/shiraz/templates/header/default is updated as simple as possible, and the “caption tiddlers” can be put in locations which make sense to the application.

Thanks!

Nick out

[Mohammad]

Hi Nick
The solution by @Springer is the easiest!
Only the header template controls the column header! So you can change

<span style="text-transform: capitalize;"><$text text=<<currentColumn>>/></span>

We may pass extra parameter to macro in the same size of fields parameter allows us to set caption for column! No extra work is needed.

If a column needs extra actions, you may need to have a custom header!

[StS]

I add the user field “erstellt”

Where do I have to increase the value to have the footer centered?

Thanks
Stefan

[Mohammad]

Hi Stefan,
The colspan here is determined based on the number of columns so footer occupies the whole table width!

[StS]

Hi Mohammad,

ok - and where can I set/manipulate the value to get the footer centered?
(I changed in DevTools the value to 4 to get it centered…)

[Mohammad]

@StS

ok - and where can I set/manipulate the value to get the footer centered?

Look for styles (or see source styles folder) and then footer! It uses flexbox now!