tips:tables_with_rowspan
Differences
This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
tips:tables_with_rowspan [2008-10-25 23:05] – comment added 84.142.175.209 | tips:tables_with_rowspan [2016-03-05 23:18] (current) – 2602:306:cf53:d1a0:bcdf:f810:e342:e4d1 | ||
---|---|---|---|
Line 1: | Line 1: | ||
+ | ======Tables with rowspans and vertical alignment====== | ||
+ | |||
+ | ===== Introduction ===== | ||
+ | |||
+ | Having examined the two current (Oct08) offerings to facilitate rowspans in a DW table (see [[tips: | ||
+ | |||
+ | |||
+ | By applying the code patches listed below, it is possible to create a table with rowspans, each with their own vertical alignment. The patches do not alter the existing table syntax. To create a rowspan, the table cell starting the rowspan must include the character ":" | ||
+ | |||
+ | Using this syntax means that the number of columns in succeeding rows will be reduced, depending on how many previous rowspans affect any particular row. | ||
+ | |||
+ | =====Features at a glance===== | ||
+ | * 100% compatible with existing DokuWiki tables. | ||
+ | * Supports bidirectional spans - column spans can be incorporated with rowspans. | ||
+ | * Supports vertical alignment (top, middle and bottom) in each rowspan using CSS. | ||
+ | * Supports both header and non-header spans. | ||
+ | |||
+ | |||
+ | |||
+ | =====Usage===== | ||
+ | |||
+ | {{ http:// | ||
+ | To generate this example table in Dokuwiki, the following syntax would be used: | ||
+ | |||
+ | < | ||
+ | ^ ^col 1 ^ col 2 ^ col 3&4^^ | ||
+ | ^row a |:2 a1-b1 | :3_ a2-c3|| a4 | | ||
+ | ^row b&c :2- | b4| | ||
+ | ^c1 ^ c4| | ||
+ | ^row d |d1 | d2 | d3| d4 | | ||
+ | </ | ||
+ | |||
+ | This 4x4 table (plus headers) has individual cells at a4, b4, c1, c4, d1, d2, d3, and d4.\\ | ||
+ | The top row and leftmost columns are header cells. c1 and c4 are also header cells.\\ | ||
+ | There are 2 2-cell blocks, the one at rowb&c is aligned vertically in the middle and the one at a1-b1 is top aligned.\\ | ||
+ | There is a 6-cell block spanning a2, a3, b2, b3, c2 and c3 which is bottom aligned vertically. | ||
+ | |||
+ | Note that the order in which a cell's content and any row spanning statement are coded is not important, either may appear first. The HTML generated by the above DW table definitions would be: | ||
+ | |||
+ | < | ||
+ | <table class=" | ||
+ | < | ||
+ | <th class=" | ||
+ | </ | ||
+ | < | ||
+ | <th class=" | ||
+ | </ | ||
+ | < | ||
+ | <th class=" | ||
+ | </ | ||
+ | < | ||
+ | <th class=" | ||
+ | </ | ||
+ | < | ||
+ | <th class=" | ||
+ | </ | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | |||
+ | =====Known Issues===== | ||
+ | * The column number in the '' | ||
+ | * Care is needed when all columns in a row have no visible content. | ||
+ | * An update to the '' | ||
+ | |||
+ | =====Patch Code===== | ||
+ | The patch was introduced into the Dokuwiki release dated 2008-05-05. | ||
+ | |||
+ | The patch involves changes to 5 code files in the '' | ||
+ | in the '' | ||
+ | |||
+ | ==== parser.php ==== | ||
+ | |||
+ | in the //class// **Doku_Parser_Mode_table**, | ||
+ | |||
+ | <code php> | ||
+ | | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: addition start */ | ||
+ | | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: addition end */ | ||
+ | | ||
+ | </ | ||
+ | |||
+ | ==== handler.php ==== | ||
+ | There are 4 separate changes to be made to this file. | ||
+ | |||
+ | === Change 1 === | ||
+ | In the //class// **Doku_Handler**, | ||
+ | |||
+ | <code php> | ||
+ | } else if ( $match == ' | ||
+ | | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: addition start */ | ||
+ | } else if ( substr($match, | ||
+ | | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: addition end */ | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | === Change 2 === | ||
+ | In the //class// **Doku_Handler_Table** find the // | ||
+ | <code php> | ||
+ | case ' | ||
+ | case ' | ||
+ | | ||
+ | | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: addition start */ | ||
+ | case ' | ||
+ | | ||
+ | | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: addition end */ | ||
+ | case ' | ||
+ | </ | ||
+ | |||
+ | === Change 3 === | ||
+ | Still in the //class// **Doku_Handler_Table** find the // | ||
+ | <code php> | ||
+ | function tableDefault($call) { | ||
+ | $this-> | ||
+ | } | ||
+ | |||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: addition start */ | ||
+ | function tableVspan($call) { | ||
+ | $this-> | ||
+ | } | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: addition end */ | ||
+ | </ | ||
+ | |||
+ | === Change 4 === | ||
+ | And finally, still in the //class// **Doku_Handler_Table**, | ||
+ | <code php> | ||
+ | $toDelete[] = $key-1; | ||
+ | $toDelete[] = $key; | ||
+ | $toDelete[] = $key+1; | ||
+ | |||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: addition start */ | ||
+ | } else if ( $call[0] == ' | ||
+ | $match = $call[1][0]; | ||
+ | $tmpa = substr($match, | ||
+ | $valign = substr($tmpa, | ||
+ | if ($valign == " | ||
+ | | ||
+ | $tmpa = substr($tmpa, | ||
+ | } else if ($valign == " | ||
+ | | ||
+ | $tmpa = substr($tmpa, | ||
+ | } | ||
+ | else $valign = ' | ||
+ | $this-> | ||
+ | $this-> | ||
+ | $toDelete[] = $key; | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: addition end */ | ||
+ | </ | ||
+ | |||
+ | ==== metadata.php ==== | ||
+ | There are 2 changes to be made to this file. | ||
+ | |||
+ | In the //class// **Doku_Renderer_metadata** find the // | ||
+ | <code php> | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: change start */ | ||
+ | function tableheader_open($colspan = 1, $align = NULL, $rowspan = 1, $valign = NULL){} | ||
+ | //function tableheader_open($colspan = 1, $align = NULL){} | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: change end */ | ||
+ | </ | ||
+ | |||
+ | and a little further on, find the // | ||
+ | <code php> | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: change start */ | ||
+ | function tablecell_open($colspan = 1, $align = NULL, $rowspan = 1, $valign = NULL){} | ||
+ | //function tablecell_open($colspan = 1, $align = NULL){} | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: change end */ | ||
+ | </ | ||
+ | |||
+ | ==== renderer.php ==== | ||
+ | |||
+ | There are 2 changes to be made to this file in a similar way to metadata.php. | ||
+ | |||
+ | In the //class// **Doku_Renderer** find the // | ||
+ | <code php> | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: change start */ | ||
+ | function tableheader_open($colspan = 1, $align = NULL, $rowspan = 1, $valign = NULL){} | ||
+ | //function tableheader_open($colspan = 1, $align = NULL){} | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: change end */ | ||
+ | </ | ||
+ | |||
+ | and a little further on, find the // | ||
+ | <code php> | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: change start */ | ||
+ | function tablecell_open($colspan = 1, $align = NULL, $rowspan = 1, $valign = NULL){} | ||
+ | //function tablecell_open($colspan = 1, $align = NULL){} | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: change end */ | ||
+ | </ | ||
+ | |||
+ | ==== xhtml.php ==== | ||
+ | There are 2 changes to be made to this file. | ||
+ | |||
+ | In the //class// **Doku_Renderer_xhtml** find the // | ||
+ | <code php> | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: replacement start */ | ||
+ | | ||
+ | $class = ' | ||
+ | if ( !is_null($align) ) { | ||
+ | | ||
+ | } | ||
+ | if ( !is_null($valign) ) { | ||
+ | | ||
+ | } | ||
+ | $class .= '"'; | ||
+ | $this-> | ||
+ | if ( $rowspan > 1 ) { | ||
+ | | ||
+ | } | ||
+ | if ( $colspan > 1 ) { | ||
+ | | ||
+ | | ||
+ | } | ||
+ | $this-> | ||
+ | } | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: replacement end */ | ||
+ | </ | ||
+ | |||
+ | and a little further on, find the // | ||
+ | |||
+ | <code php> | ||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: replacement start */ | ||
+ | | ||
+ | $class = ' | ||
+ | if ( !is_null($align) ) { | ||
+ | | ||
+ | } | ||
+ | if ( !is_null($valign) ) { | ||
+ | | ||
+ | } | ||
+ | $class .= '"'; | ||
+ | $this-> | ||
+ | if ( $rowspan > 1 ) { | ||
+ | | ||
+ | } | ||
+ | if ( $colspan > 1 ) { | ||
+ | | ||
+ | | ||
+ | } | ||
+ | $this-> | ||
+ | } | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: replacement end */ | ||
+ | </ | ||
+ | |||
+ | ==== userstyle.css ==== | ||
+ | |||
+ | And finally, the CSS is added to the **conf/ | ||
+ | <code css> | ||
+ | /* for table cell vertical alignment | ||
+ | .valigntop {vertical-align: | ||
+ | .valignmid {vertical-align: | ||
+ | .valignbot {vertical-align: | ||
+ | </ | ||
+ | |||
+ | ===== Comments / Discussion ===== | ||
+ | |||
+ | Feel free to express your opinion. | ||
+ | |||
+ | |||
+ | ---- | ||
+ | |||
+ | Hi, it works very good, many thanks! | ||
+ | PS look [[http:// | ||
+ | |||
+ | Frank | ||
+ | |||
+ | ---- | ||
+ | |||
+ | Hi Jan, | ||
+ | |||
+ | Very nice and useful patch! | ||
+ | However, I am not sure that this way of integrating rowspan is really 100% compatible. What worries me is that the expression ://n// can occur anywhere in the cell and still means " | ||
+ | I would prefer if rowspan functionality will be invoked only when the expression directly follows the " | ||
+ | |||
+ | My understanding of the whole parser is still not very good. \\ | ||
+ | But the following modification to **Change 4** of **inc/ | ||
+ | <code php> | ||
+ | $toDelete[] = $key-1; | ||
+ | $toDelete[] = $key; | ||
+ | $toDelete[] = $key+1; | ||
+ | |||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: addition start */ | ||
+ | } else if ( $call[0] == ' | ||
+ | // Apply only immediately after a cell open | ||
+ | if ( $this-> | ||
+ | $match = $call[1][0]; | ||
+ | $tmpa = substr($match, | ||
+ | $valign = substr($tmpa, | ||
+ | if ($valign == " | ||
+ | | ||
+ | $tmpa = substr($tmpa, | ||
+ | } else if ($valign == " | ||
+ | | ||
+ | $tmpa = substr($tmpa, | ||
+ | } | ||
+ | else $valign = ' | ||
+ | $this-> | ||
+ | $this-> | ||
+ | $toDelete[] = $key; | ||
+ | } | ||
+ | else { | ||
+ | // Convert the false-positive back to cdata | ||
+ | $this-> | ||
+ | } | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: addition end */ | ||
+ | </ | ||
+ | |||
+ | Is it a good idea or a bad one? // | ||
+ | |||
+ | > Many thanks for your feedback, Astrid. | ||
+ | > | ||
+ | > | ||
+ | > | ||
+ | >**Patch 3a** \\ | ||
+ | >Still in the //class// **Doku_Handler_Table** find the // | ||
+ | <code php> | ||
+ | } else if ( $call[0] == ' | ||
+ | |||
+ | // If the previous element was a cell open, align right | ||
+ | if ( $this-> | ||
+ | $this-> | ||
+ | |||
+ | /*** ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ROWSPAN: addition start */ | ||
+ | } else if ( $this-> | ||
+ | $this-> | ||
+ | /*** ------------------------------------------------------------ ROWSPAN: addition end */ | ||
+ | </ | ||
+ | > Now the only loss of compatibility with existing DW table markup would be when ://n// data is used in a left-aligned cell. The solution here would be an enforced change to the existing DW table cell data to wrap %% around this data in order to ignore the markup. | ||
+ | |||
+ | ---- | ||
+ | |||
+ | I failed at first (probably made a copy paste error), but then tried again after restoring and it worked. I incorporated the Astrid patch as well, since I like stricter syntax and can sense data with colons and numbers coming on some day. Though I won't be using it much, I sure missed rowspans at several points in my life of using DokuWiki.\\ | ||
+ | |||