[Show/Hide Right Column]

Displays a table using TikiWiki odd/even style
Print

Plugin FancyTable

This plugin displays the data using the Tiki odd/even table style.

Usage

The data (and the head parameter) is given one row per line, with columns separated by ~|~ (or separated by | starting with 4.0).

To display a fancy table in a wiki page, use the syntax:

{FANCYTABLE(head=> ,headclass=> )}cells{FANCYTABLE}

Future versions (with 4.0 and after):

{FANCYTABLE(head=h1c1|h1c2|h1c3>>h2c1|h2c2|h2c3 , headclass= , headaligns=left|right|center|justify , headvaligns=top|middle|bottom|baseline , colwidths= , colaligns=left|right|center|justify , colvaligns=top|middle|bottom|baseline , sortable= , sortlist= )}cells{FANCYTABLE}

Parameter Accepted values Effect Optional Since
head text separated by | (starting with 4.0) or ~|~ (all versions) for each cell
separate by >> for each header row (with 4.2)
Creates specially formatted header cells and rows optional
(body - between FANCYTABLE tags) text separated by | (starting with 4.0) or ~|~ (all versions) for each cell Creates cells in the body of the table. Start a new line to start a new row. required
headclass Any valid CSS class Applies class styling to the header rows optional 2.0
sortable y or n allows to be able to sort the columns with javascript optional 4.0
sortlist [0,1],[1,0]...
Pairs of numbers for: [columnIndex, sortDirection],... where columnIndex is a zero-based index for the columns left-to-right, and sortDirection is 0 for ascending and 1 for descending. Example that sorts ascending first by column 1 and then column 2: [0,0],[1,0]
Table is initially pre-sorted according to this setting. optional 4.0
(in any cell) one or more forward slashes (/) or backslashes (\) at the beginning of the cell Cell will span the number of columns indicated by the number of forward slashes, and will span the number of rows indicated by the number of backslashes. optional 4.0
headaligns
colaligns
left
right
center
justify
Aligns text horizontally in header columns (headaligns) or table body columns (colaligns). Separate setting for each column by a | optional 4.1
headvaligns
colvaligns
top
middle
bottom
baseline
Aligns text vertically in header columns (headvaligns) or table body columns (colvaligns). Separate setting for each column by a | optional 4.1
colwidths number of pixels followed by 'px', or percent followed by '%', for each column separated by a | Sets the width of the columns optional 4.1

noteNote
Sorting a table with cells that span multiple columns or rows can give unexpected results.

Example

Example:

This code:

{FANCYTABLE( head=" Quantity | Vegetables | Fruits", sortable="y",sortList="[0,0],[1,0]")}
10 | onions | apples
10 | cucumbers | lemons
100 | carrots | oranges
10 | tomatoes | water melons
50 | peas | strawberries
{FANCYTABLE}

.
Would produce:

Quantity Vegetables Fruits
10 onions apples
10 cucumbers lemons
100 carrots oranges
10 tomatoes water melons
50 peas strawberries

This code:

{FANCYTABLE( head=" Type | Value ")}
\\Vegetable | onions 
carrots
\\\Fruits | lemons
tomatoes 
strawberries
{FANCYTABLE}

.
Would produce:

Type Value
Vegetable onions
carrots
Fruits lemons
tomatoes
strawberries

Sort

Available starting with TikiWiki version 4.0

The sortable parameter uses jquery, so the following must be enabled for it to work:

  • Go to Admin home > Editing and Plugins > Plugins (tab) and click on jq to enable the wikiplugin jq.
  • Go to Admin Home > Look and Feel > UI Effects and click on "JQuery Sortable Tables".

See a live example in the table above showing the fancytable parameters. See http://tablesorter.com for more information on the base jq plugin being used.


Contributors to this page: sylvie4333 points  , xavidp901 points  , Xavi36278 points  , system , Marc Laporte5511 points  , lindon2331 points  and btiffin5 points  .
Page last modified on Tuesday 04 May, 2010 16:57:32 UTC by sylvie4333 points .

Find by Page Name

Exact match

Keywords

The following is a list of keywords that should serve as hubs for navigation within the Tiki documentation and should correspond to development keywords (bug reports and feature requests):