1 # <a name="Table Plugin"></a> Table Plugin
3 Gives extra control of table display:
6 - Changing table properties like border width, cell spacing and cell padding
7 - Changing background color for header cells
8 - Changing background color for data cells - colors can _alternate_
9 - Behaviour can be specified for a specific table using %TABLE\{...\}% or with global preferences
11 ## <a name="%TOPIC% Global Settings"></a> %TOPIC% Global Settings
13 Plugin settings are stored as preferences variables. To reference a plugin setting write <code>**%<plugin>\_<setting>%**</code>, for example, <code>**%INTERWIKIPLUGIN\_SHORTDESCRIPTION%**</code>
15 - One line description, shown in the [[TextFormattingRules]] topic:
16 - Set SHORTDESCRIPTION = Control attributes of tables and sorting of table columns
18 - Set DEBUG to 1 to get debug messages in `data/debug.txt`. Default: `0`
21 - Table border width. Default: 1
24 - Table cell padding. Default: 0
27 - Table cell spacing. Default: 1
30 - Vertical alignment of cells. Set to: `top`, `middle`, `bottom` or `baseline`; default: (empty)
33 - Table header cell alignment. Set to: `left`, `center`, `right` or `justify`; default: (empty)
36 - Table data cell alignment. Set to: `left`, `center`, `right` or `justify`; default: (empty)
39 - Color for header cells ('\*'s around text). Default: <span>\#99CCCC</span>
40 - #Set HEADER\_BG = red
42 - Background color for table rows, two alternate colors. Default: <span>\#FFFFCC</span>,<span>\#FFFFFF</span>
43 - Set DATA\_BG = #FFFFCC,#FFFFFF
46 - #Set SORT = attachments
50 ## <a name="Sorting"></a> Sorting
52 Click on column heading text to sort by a column. Initial column will be sorted in descending order, click again to get ascending order. The type of data in the cell is determined automatically:
56 - dd-MMM-YY or dd-MM-YYYY (can be / or space in place of -)
57 - MMM is Jan, Feb, etc
58 - number is digits, with optional decimal point
59 - otherwise treated as text
61 ## <a name="Per Table Settings"></a> Per Table Settings
63 On line before the table use `%TABLE{...}%`:
65 <table border="1" cellpadding="0" cellspacing="0" style="border-width: 1px">
67 <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=0;table=1;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Argument</font></a></th>
68 <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=1;table=1;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Comment</font></a></th>
69 <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=2;table=1;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Example</font></a></th>
72 <td bgcolor="#ecf2f8" style=""><code>sort</code></td>
73 <td bgcolor="#ecf2f8" style=""> Set table sorting <code>on</code> or <code>off</code></td>
74 <td bgcolor="#ecf2f8" style=""><code>sort="on"</code></td>
77 <td bgcolor="#ffffff" style=""><code>initsort</code></td>
78 <td bgcolor="#ffffff" style=""> Column to sort initially (1 to number of columns) </td>
79 <td bgcolor="#ffffff" style=""><code>initsort="2"</code></td>
82 <td bgcolor="#ecf2f8" style=""><code>initdirection</code></td>
83 <td bgcolor="#ecf2f8" style=""> Initial sorting direction for <code>initsort</code>, set to <code>up</code> or <code>down</code></td>
84 <td bgcolor="#ecf2f8" style=""><code>initsort="down"</code></td>
87 <td bgcolor="#ffffff" style=""><code>headerbg</code></td>
88 <td bgcolor="#ffffff" style=""> Header cell background colour </td>
89 <td bgcolor="#ffffff" style=""><code>headerbg="#99CCCC"</code></td>
92 <td bgcolor="#ecf2f8" style=""><code>databg</code></td>
93 <td bgcolor="#ecf2f8" style=""> Data cell background colour, a comma separated list </td>
94 <td bgcolor="#ecf2f8" style=""><code>databg="#C8CB8F,#DBDDB5"</code></td>
97 <td bgcolor="#ffffff" style=""><code>tableborder</code></td>
98 <td bgcolor="#ffffff" style=""> Table border width (pixels) </td>
99 <td bgcolor="#ffffff" style=""><code>tableborder="2"</code></td>
102 <td bgcolor="#ecf2f8" style=""><code>cellpadding</code></td>
103 <td bgcolor="#ecf2f8" style=""> Cell padding (pixels) </td>
104 <td bgcolor="#ecf2f8" style=""><code>cellpadding="0"</code></td>
107 <td bgcolor="#ffffff" style=""><code>cellspacing</code></td>
108 <td bgcolor="#ffffff" style=""> Cell spacing (pixels) </td>
109 <td bgcolor="#ffffff" style=""><code>cellspacing="3"</code></td>
112 <td bgcolor="#ecf2f8" style=""><code>valign</code></td>
113 <td bgcolor="#ecf2f8" style=""> Vertical alignment of cells, set to <code>top</code>, <code>middle</code>, <code>bottom</code> or <code>baseline</code></td>
114 <td bgcolor="#ecf2f8" style=""><code>valign="top"</code></td>
117 <td bgcolor="#ffffff" style=""><code>headeralign</code></td>
118 <td bgcolor="#ffffff" style=""> Header cell alignment, set to <code>left</code>, <code>center</code>, <code>right</code> or <code>justify</code>. Overrides individual cell settings </td>
119 <td bgcolor="#ffffff" style=""><code>headeralign="left"</code></td>
122 <td bgcolor="#ecf2f8" style=""><code>dataalign</code></td>
123 <td bgcolor="#ecf2f8" style=""> Data cell alignment, set to <code>left</code>, <code>center</code>, <code>right</code> or <code>justify</code>. Overrides individual cell settings </td>
124 <td bgcolor="#ecf2f8" style=""><code>dataalign="center"</code></td>
128 All default to the global setting
130 ## <a name="Examples"></a> Examples
132 Line before table: `%TABLE{sort="on" tableborder="0" cellpadding="1" cellspacing="3" headerbg="#99CCCC" databg="#C8CB8F,#DBDDB5"}%`
134 <table border="0" cellpadding="1" cellspacing="3" style="border-width: 0px">
136 <th bgcolor="#99CCCC" maxcols="0" style=""><a href="http://localhost?sortcol=0;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Num</font></a></th>
137 <th bgcolor="#99CCCC" maxcols="0" style=""><a href="http://localhost?sortcol=1;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Status</font></a></th>
138 <th bgcolor="#99CCCC" maxcols="0" style=""><a href="http://localhost?sortcol=2;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Action</font></a></th>
139 <th bgcolor="#99CCCC" maxcols="0" style=""><a href="http://localhost?sortcol=3;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Who</font></a></th>
140 <th bgcolor="#99CCCC" maxcols="0" style=""><a href="http://localhost?sortcol=4;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">When</font></a></th>
141 <th bgcolor="#99CCCC" maxcols="0" style=""><a href="http://localhost?sortcol=5;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Progress</font></a></th>
144 <td bgcolor="#C8CB8F" style=""> 1 </td>
145 <td bgcolor="#C8CB8F" style=""> C </td>
146 <td bgcolor="#C8CB8F" style=""> Chose new colours </td>
147 <td bgcolor="#C8CB8F" style=""> John </td>
148 <td bgcolor="#C8CB8F" style=""> 1-Dec-02 </td>
149 <td bgcolor="#C8CB8F" style=""> </td>
152 <td bgcolor="#DBDDB5" style=""> 2 </td>
153 <td bgcolor="#DBDDB5" style=""> X </td>
154 <td bgcolor="#DBDDB5" style=""> Release </td>
155 <td bgcolor="#DBDDB5" style=""> John </td>
156 <td bgcolor="#DBDDB5" style=""> 1-Apr-02 </td>
157 <td bgcolor="#DBDDB5" style=""> </td>
160 <td bgcolor="#C8CB8F" style=""> 3 </td>
161 <td bgcolor="#C8CB8F" style=""> </td>
162 <td bgcolor="#C8CB8F" style=""> Get feedback </td>
163 <td bgcolor="#C8CB8F" style=""> Anne </td>
164 <td bgcolor="#C8CB8F" style=""> 1-Feb-02 </td>
165 <td bgcolor="#C8CB8F" style=""> </td>
168 <td bgcolor="#DBDDB5" style=""> 12 </td>
169 <td bgcolor="#DBDDB5" style=""> C </td>
170 <td bgcolor="#DBDDB5" style=""> Spec error handling </td>
171 <td bgcolor="#DBDDB5" style=""> Jack </td>
172 <td bgcolor="#DBDDB5" style=""> 1-Dec-02 </td>
173 <td bgcolor="#DBDDB5" style=""> </td>
176 <td bgcolor="#C8CB8F" style=""> 5 </td>
177 <td bgcolor="#C8CB8F" style=""> </td>
178 <td bgcolor="#C8CB8F" style=""> Abc </td>
179 <td bgcolor="#C8CB8F" style=""> John </td>
180 <td bgcolor="#C8CB8F" style=""> </td>
181 <td bgcolor="#C8CB8F" style=""> </td>
185 ## <a name="Plugin Installation Instructions"></a> Plugin Installation Instructions
187 - Download the ZIP file from the Plugin web (see below)
188 - Unzip <code>**%TOPIC%.zip**</code> in your twiki installation directory. Content: <table border="1" cellpadding="0" cellspacing="0" style="border-width: 1px">
190 <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=0;table=3;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">File:</font></a></th>
191 <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=1;table=3;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Description:</font></a></th>
194 <td bgcolor="#ecf2f8" style=""><code><b>data/TWiki/%TOPIC%.txt</b></code></td>
195 <td bgcolor="#ecf2f8" style=""> Plugin topic </td>
198 <td bgcolor="#ffffff" style=""><code><b>data/TWiki/%TOPIC%.txt,v</b></code></td>
199 <td bgcolor="#ffffff" style=""> Plugin topic repository </td>
202 <td bgcolor="#ecf2f8" style=""><code><b>lib/TWiki/Plugins/%TOPIC%.pm</b></code></td>
203 <td bgcolor="#ecf2f8" style=""> Plugin Perl module </td>
206 <td bgcolor="#ffffff" style=""><code><b>pub/TWiki/%TOPIC%/diamond.gif</b></code></td>
207 <td bgcolor="#ffffff" style=""> Diamond symbol </td>
210 <td bgcolor="#ecf2f8" style=""><code><b>pub/TWiki/%TOPIC%/down.gif</b></code></td>
211 <td bgcolor="#ecf2f8" style=""> Down arrow </td>
214 <td bgcolor="#ffffff" style=""><code><b>pub/TWiki/%TOPIC%/up.gif</b></code></td>
215 <td bgcolor="#ffffff" style=""> Up arrow </td>
218 - Test if the plugin is correctly installed:
219 - Check above example if the table renders as expected
220 - Try click on heading to sort. Other tables should also be sortable
222 ## <a name="Plugin Info"></a> Plugin Info
224 <table border="1" cellpadding="0" cellspacing="0" style="border-width: 1px">
226 <td align="right" bgcolor="#ecf2f8" style=""> Plugin Author: </td>
227 <td bgcolor="#ecf2f8" style="">[[TWiki/JohnTalintyre]], [[TWiki/PeterThoeny]]</td>
230 <td align="right" bgcolor="#ffffff" style=""> Plugin Version: </td>
231 <td bgcolor="#ffffff" style=""> 13 Mar 2002 </td>
234 <td align="right" bgcolor="#ecf2f8" style=""> Change History: </td>
235 <td bgcolor="#ecf2f8" style=""> 13 Mar 2002 PTh: Added TWiki:Main/ShawnBradford 's initsort and initdirection <br /> 12 Mar 2002 PTh: Added valign, headeralign and dataalign; fixed bug of swapped cellpadding/cellspacing; fixed warning of uninitialized value <br /> 05 Jan 2002 PTh: Fixed sorting bug of cells with leading white space <br /> 06 Dec 2001 PTh: Fixed date sorting bug <br /> 03 Dec 2001 PTh: Fixed sort="off" bug and more <br /> 29 Nov 2001: PTh fixed Perl warnings <br /> 16 Nov 2001: PTh added table border, cell spacing, cell padding, gif files <br /> 07 Oct 2001: Initial version </td>
238 <td align="right" bgcolor="#ffffff" style=""> CPAN Dependencies: </td>
239 <td bgcolor="#ffffff" style=""> none </td>
242 <td align="right" bgcolor="#ecf2f8" style=""> Other Dependencies: </td>
243 <td bgcolor="#ecf2f8" style=""> none </td>
246 <td align="right" bgcolor="#ffffff" style=""> Perl Version: </td>
247 <td bgcolor="#ffffff" style=""> 5.0 </td>
250 <td align="right" bgcolor="#ecf2f8" style=""> Plugin Home: </td>
251 <td bgcolor="#ecf2f8" style=""><a href="http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%" target="_top">http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%</a></td>
254 <td align="right" bgcolor="#ffffff" style=""> Feedback: </td>
255 <td bgcolor="#ffffff" style=""><a href="http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Dev" target="_top">http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Dev</a></td>
259 **_Related Topics:_** [[TWikiPreferences]], [[TWikiPlugins]]
261 -- [[JohnTalintyre]] - 07 Oct 2001 <br /> -- [[PeterThoeny]] - 13 Mar 2002 <br />