uestla/TwiGrid

Possibility to decorate rows/cells

tprochazka opened this issue · 8 comments

Only thing that I miss most is possibility to decorate rows and cell.
I mean mainly possibility to add custom class per row or cell in similar way how ValueGetter is done.
Ideally some interface with several methods which will be called for every row or cell and allows to ad class there or completely change content of the desired cell, like add some html element into it.

The main thing is that the value getter is a backend thing so it's logical to have it configurable in PHP. But configuring CSS classes of HTML elements of the grid in PHP is something I tried to avoid from the beginning.

Is there a special use case where extending the default body-cell block is not enough?

@tprochazka Even more so, I just added a new block body-cell-inline so that if you want to add a certain class to every body-cell, you can extend that block.

You should still be able to change rendering of each individual column value by extending body-cell-$column-content block.

Please let me know if you're OK with this ;-)

I need stuff like change color according the value, replace value by image symbol, make link inside of cell and create summary row at the end of the table (because that I need to change style also for whole row element).

Maybe the easiest way is override body-cell and change rendering to noescape and directly put the HTML elements to the column value, but it is quite ugly solution.

But it looks that I have whole row variable available inside of

{define body-cell}
	<td n:class='body-cell, "body-cell-{$column}"'>{$$recordVariable |getValue:$column:FALSE}</td>
{/define}

So maybe I can create for some formatting attributes in the data.

body-cell-inline is just for inline editing mode right?

And

{define cell-email-content}
    xyz
{/define}

Doesn't work for me, probably it is also new think.
I will try to use latest snapshot version.

for putting class to I did this

{define body-row}
    <tr n:class="$isInlineEdited ? success , isset($$recordVariable->rowClass) ? $$recordVariable->rowClass : null"
        n:attr="id => isset($$recordVariable->rowId) ? $$recordVariable->rowId : null">
        {include #body-row-cells,
			$recordVariable => $$recordVariable,
			primaryString => ($primaryString = ($record |primaryToString)),
			isInlineEdited => $hasInlineEdit && $iePrimary === $primaryString
		}
    </tr>
{/define}

body-cell-inline is just for inline editing mode right?

Yes.

{define cell-email-content} ...

The correct name of the block is body-cell-email-content.

for putting class to I did this ...

That looks OK but you shouldn't be using $recordVariable in your templates (only if it's some "base" template which you then also extend). You should use the actual record variable name, which is record by default.

So it will then look like

{define body-row}
    <tr n:class="$isInlineEdited ? success, isset($record->rowClass) ? $record->rowClass"
        n:attr="id => isset($record->rowId) ? $record->rowId">
        {include #body-row-cells,
			record => $record,
			primaryString => ($primaryString = ($record |primaryToString)),
			isInlineEdited => $hasInlineEdit && $iePrimary === $primaryString
		}
    </tr>
{/define}

NOTE: notice the simplification of the ternary operator - in Latte you don't have to write the : null part.

Thanks a lot! Everything works.

I only can't figure out how to make template hierarchy.
I want to have one common grid template and then several specific grid template which will extends the general one.

I tried this

{extends $defaultTemplate}
{include '@grid.latte'}

{define body-cell-email-content}
    <a href="mailto:{$record->$column}">{$record->$column}</a>
{/define}

But it ignore include.
When I remove extends (it's included in common @grid.latte), include is used, but everything after include is ignored.

I reply itself :-)

{extends '@grid.latte'}