Aldeed:­tabular - change classes dynamically?

1

Situation

I’m using the fantastic aldeed:tabular package by @aldeed for a fairly large table in my app like so:

{{> tabular id="datatable" table=TabularTables.MyCollection class="table compact"}}

Goal

The compact class controls the density of the layout and can be toggled by the user.
The change in density is animated with css transitions.

So by default (with the compact class) the table looks like this:

1427×455 46.3 KB

While without the compact class it smoothly animates to this:

1428×603 48.7 KB

Great! :slight_smile:

Problem

I could store the layout density in a Session (default/compact) and create a helper for this.

Non-Solution # 1:
I can’t really use this helper like this, because this just doesn’t make sense:
{{> tabular id="datatable" table=TabularTables.MyCollection class="table {{#if layoutCompact}}compact{{/if}}"}}

Non-Solution # 2:
I also can’t just do it like so, since this would break the css transitions:

{{#if layoutCompact}}
  {{> tabular id="datatable" table=TabularTables.MyCollection class="table compact"}}
{{else}}
  {{> tabular id="datatable" table=TabularTables.MyCollection class="table"}}
{{/if}}

Is there a way to achieve this?
Thanks!

2 
class="table {{compact}}"

Where compact is a helper returning ‘compact’ or null as appropriate?

3

Outch. If this works I’m going to cry :smiley:
I’ve spend half a day trying to figure this out… shame shame

Thanks @robfallows

1 Like
4

Hm, looks like this isn’t working?
I guess I cant really put a Blaze helper inside a Blaze inclusion tag. Or am I doing something wrong?

5

I’ve put together a small repo: https://github.com/robfallows/reactiveclassdemo

1 Like
6

Hi Rob,
huge thanks for creating this repo. I understand how to dynamically use helpers in such a way.

My problem comes from the fact that I don’t have access to the Template aldeed:tabular provides:

So this…
{{> tabular id="datatable" table=TabularTables.MyCollection class="table"}}
… comes from the package and I have no access to whats “behind” it. At least I don’t think so.

Sorry for the unclear question.

7

Oops - my bad.

I’ve update the repo to show this working with aldeed:tabular. Basically, use a helper to return the complete class parameter in the template reference. The line from my repo is:

{{> tabular table=TabularTables.Books class=getclass}}