A little coding fun: simple table with resizeable rows and columns

[Charlie Veniot]

G'day, I felt like experimenting a little bit, trying to figure out an easy way to create a simple table that allows resizing rows and columns of data.

So a wee TiddlyWiki CSS + HTML itch that needed some scratching.

For yer interest, please find below a screenshot and the related code.

Cheers !

Code:

<$vars rowCount={{{ [[4]]}}}

           colCount={{{ [[5]] }}}>

<table>

<tr>

<th>

</th>

<$list filter="[range<colCount>]">

<th style="padding:0px;border:1px solid black;">

<div style="resize:horizontal;overflow:auto; min-width:1em; min-height:2em;text-align:center;">

 {{!!title}}

</div>

</th>

</$list>

</tr>

<$list filter="[range<rowCount>]">

<$vars currentRow=<<currentTiddler>>>

<tr style="border:1px solid black;">

<th style="padding:0px;border:1px solid black;">

<div style="resize:vertical;overflow:auto;min-width:2em; min-height:1em;text-align:center;">

 <<currentRow>>

</div>

</th>

<$list filter="[range<colCount>]">

<$vars currentCol=<<currentTiddler>>>

<td style="border:1px solid blue;min-height:1em;padding:1px;">

<div style="width:100%; height:100%;overflow:auto;">

<<currentCol>>

</div>

</td>

</$vars>

</$list>

</tr>

</$vars>

</$list>

</table>

</$vars>

[Mohammad Rahmani]

Very nice!

Why not to use just

<$vars rowCount=4

           colCount=5>

Best wishes

Mohammad

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/b63eb895-c40b-477f-ad4a-6546611127c6n%40googlegroups.com.

[Charlie Veniot]

Because my code will eventually be getting those values from a data tiddler.  So my code snapshot was caught midstream between points A and Z.

Same goes for most anything else that seems a little bit odd/overkill.  Well, bound to be some goofiness/slopiness as I'm just in a "get the thing working" mindset ...

"Pretty" code likely for later.

[jtech108]

Ooooh veeeery interesting indeed! (O_o)

Regards,

Julio