user_guide/libraries/table.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
   3 <head>
   4
   5 <title>CodeIgniter User Guide : HTML Table Class</title>
   6
   7 <link rel='stylesheet' type='text/css' media='all' href='../userguide.css' />
   8
   9 <script type="text/javascript" src="../nav/nav.js"></script>
  10 <script type="text/javascript" src="../nav/prototype.lite.js"></script>
  11 <script type="text/javascript" src="../nav/moo.fx.js"></script>
  12 <script type="text/javascript" src="../nav/user_guide_menu.js"></script>
  13
  14 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  15 <meta http-equiv='expires' content='-1' />
  16 <meta http-equiv= 'pragma' content='no-cache' />
  17 <meta name='robots' content='all' />
  18 <meta name='author' content='ExpressionEngine Dev Team' />
  19 <meta name='description' content='CodeIgniter User Guide' />
  20
  21 </head>
  22 <body>
  23
  24 <!-- START NAVIGATION -->
  25 <div id="nav"><div id="nav_inner"><script type="text/javascript">create_menu('../');</script></div></div>
  26 <div id="nav2"><a name="top"></a><a href="javascript:void(0);" onclick="myHeight.toggle();"><img src="../images/nav_toggle_darker.jpg" width="153" height="44" border="0" title="Toggle Table of Contents" alt="Toggle Table of Contents" /></a></div>
  27 <div id="masthead">
  28 <table cellpadding="0" cellspacing="0" border="0" style="width:100%">
  29 <tr>
  30 <td><h1>CodeIgniter User Guide Version 2.0.2</h1></td>
  31 <td id="breadcrumb_right"><a href="../toc.html">Table of Contents Page</a></td>
  32 </tr>
  33 </table>
  34 </div>
  35 <!-- END NAVIGATION -->
  36
  37
  38 <!-- START BREADCRUMB -->
  39 <table cellpadding="0" cellspacing="0" border="0" style="width:100%">
  40 <tr>
  41 <td id="breadcrumb">
  42 <a href="http://codeigniter.com/">CodeIgniter Home</a> &nbsp;&#8250;&nbsp;
  43 <a href="../index.html">User Guide Home</a> &nbsp;&#8250;&nbsp;
  44 HTML Table Class
  45 </td>
  46 <td id="searchbox"><form method="get" action="http://www.google.com/search"><input type="hidden" name="as_sitesearch" id="as_sitesearch" value="codeigniter.com/user_guide/" />Search User Guide&nbsp; <input type="text" class="input" style="width:200px;" name="q" id="q" size="31" maxlength="255" value="" />&nbsp;<input type="submit" class="submit" name="sa" value="Go" /></form></td>
  47 </tr>
  48 </table>
  49 <!-- END BREADCRUMB -->
  50
  51 <br clear="all" />
  52
  53
  54 <!-- START CONTENT -->
  55 <div id="content">
  56
  57
  58 <h1>HTML Table Class</h1>
  59
  60 <p>The Table Class provides functions that enable you to auto-generate HTML tables from arrays or database result sets.</p>
  61
  62 <h2>Initializing the Class</h2>
  63
  64 <p>Like most other classes in CodeIgniter, the Table class is initialized in your controller using the <dfn>$this->load->library</dfn> function:</p>
  65
  66 <code>$this->load->library('table');</code>
  67 <p>Once loaded, the Table library object will be available using: <dfn>$this->table</dfn></p>
  68
  69
  70 <h2>Examples</h2>
  71
  72 <p>Here is an example showing how you can create a table from a multi-dimensional array.
  73 Note that the first array index will become the table heading (or you can set your own headings using the
  74 <dfn>set_heading()</dfn> function described in the function reference below).</p>
  75
  76 <code>
  77 $this->load->library('table');<br />
  78 <br />
  79 $data = array(<br />
  80 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;array('Name', 'Color', 'Size'),<br />
  81 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;array('Fred', 'Blue', 'Small'),<br />
  82 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;array('Mary', 'Red', 'Large'),<br />
  83 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;array('John', 'Green', 'Medium')  <br />
  84 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;);<br />
  85 <br />
  86 echo $this->table->generate($data);
  87 </code>
  88
  89 <p>Here is an example of a table created from a database query result. The table class will automatically generate the
  90 headings based on the table names (or you can set your own headings using the <dfn>set_heading()</dfn> function described
  91 in the function reference below).</p>
  92
  93 <code>
  94 $this->load->library('table');<br />
  95 <br />
  96 $query = $this->db->query("SELECT * FROM my_table");<br />
  97 <br />
  98 echo $this->table->generate($query);
  99 </code>
 100
 101
 102 <p>Here is an example showing how you might create a table using discrete parameters:</p>
 103
 104 <code>
 105 $this->load->library('table');<br />
 106 <br />
 107 $this->table->set_heading('Name', 'Color', 'Size');<br />
 108 <br />
 109 $this->table->add_row('Fred', 'Blue', 'Small');<br />
 110 $this->table->add_row('Mary', 'Red', 'Large');<br />
 111 $this->table->add_row('John', 'Green', 'Medium');<br />
 112 <br />
 113 echo $this->table->generate();
 114 </code>
 115
 116 <p>Here is the same example, except instead of individual parameters, arrays are used:</p>
 117
 118 <code>
 119 $this->load->library('table');<br />
 120 <br />
 121 $this->table->set_heading(array('Name', 'Color', 'Size'));<br />
 122 <br />
 123 $this->table->add_row(array('Fred', 'Blue', 'Small'));<br />
 124 $this->table->add_row(array('Mary', 'Red', 'Large'));<br />
 125 $this->table->add_row(array('John', 'Green', 'Medium'));<br />
 126 <br />
 127 echo $this->table->generate();
 128 </code>
 129
 130
 131 <h2>Changing the Look of Your Table</h2>
 132
 133 <p>The Table Class permits you to set a table template with which you can specify the design of your layout.  Here is the template
 134 prototype:</p>
 135
 136 <code>
 137 $tmpl =  array (<br />
 138 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'table_open'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;table border="0" cellpadding="4" cellspacing="0">',<br />
 139 <br />
 140 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'heading_row_start'&nbsp;&nbsp;&nbsp;=> '&lt;tr>',<br />
 141 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'heading_row_end'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;/tr>',<br />
 142 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'heading_cell_start'&nbsp;&nbsp;=> '&lt;th>',<br />
 143 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'heading_cell_end'&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;/th>',<br />
 144 <br />
 145 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'row_start'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;tr>',<br />
 146 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'row_end'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;/tr>',<br />
 147 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'cell_start'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;td>',<br />
 148 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'cell_end'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;/td>',<br />
 149 <br />
 150 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'row_alt_start'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;tr>',<br />
 151 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'row_alt_end'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;/tr>',<br />
 152 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'cell_alt_start'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;td>',<br />
 153 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'cell_alt_end'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;/td>',<br />
 154 <br />
 155 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'table_close'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=> '&lt;/table>'<br />
 156 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;);<br />
 157
 158 <br />
 159 $this->table->set_template($tmpl);
 160 </code>
 161
 162 <p class="important"><strong>Note:</strong>&nbsp; You'll notice there are two sets of "row" blocks in the template.  These permit you to create alternating row colors or design elements that alternate with each
 163 iteration of the row data.</p>
 164
 165 <p>You are NOT required to submit a complete template.  If you only need to change parts of the layout you can simply submit those elements.
 166 In this example, only the table opening tag is being changed:</p>
 167
 168 <code>
 169 $tmpl =  array ( 'table_open'&nbsp;&nbsp;=> '&lt;table border="1" cellpadding="2" cellspacing="1" class="mytable">' );<br />
 170
 171 <br />
 172 $this->table->set_template($tmpl);
 173 </code>
 174
 175 <br />
 176 <h1>Function Reference</h1>
 177
 178 <h2>$this->table->generate()</h2>
 179 <p>Returns a string containing the generated table.  Accepts an optional parameter which can be an array or a database result object.</p>
 180
 181 <h2>$this->table->set_caption()</h2>
 182
 183 <p>Permits you to add a caption to the table.</p>
 184
 185 <code>$this->table->set_caption('Colors');</code>
 186
 187 <h2>$this->table->set_heading()</h2>
 188
 189 <p>Permits you to set the table heading.  You can submit an array or discrete params:</p>
 190
 191 <code>$this->table->set_heading('Name', 'Color', 'Size');</code>
 192 <code>$this->table->set_heading(array('Name', 'Color', 'Size'));</code>
 193
 194 <h2>$this->table->add_row()</h2>
 195
 196 <p>Permits you to add a row to your table.  You can submit an array or discrete params:</p>
 197
 198 <code>$this->table->add_row('Blue', 'Red', 'Green');</code>
 199 <code>$this->table->add_row(array('Blue', 'Red', 'Green'));</code>
 200
 201 <p>If you would like to set an individual cell's tag attributes, you can use an associative array for that cell.  The associative key <dfn>'data'</dfn> defines the cell's data.  Any other key =&gt; val pairs are added as <dfn>key='val'</dfn> attributes to the tag:</p>
 202
 203 <code>$cell = array('data' => 'Blue', 'class' => 'highlight', 'colspan' => 2);<br />
 204 $this->table->add_row($cell, 'Red', 'Green');<br />
 205 <br />
 206 // generates<br />
 207 // &lt;td class='highlight' colspan='2'&gt;Blue&lt;/td&gt;&lt;td&gt;Red&lt;/td&gt;&lt;td&gt;Green&lt;/td&gt;
 208 </code>
 209
 210 <h2>$this->table->make_columns()</h2>
 211
 212 <p>This function takes a one-dimensional array as input and creates
 213 a multi-dimensional array with a depth equal to the number of
 214 columns desired.  This allows a single array with many elements to  be
 215 displayed in a table that has a fixed column count.  Consider this example:</p>
 216
 217 <code>
 218 $list = array('one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve');<br />
 219 <br />
 220 $new_list = $this->table->make_columns($list, 3);<br />
 221 <br />
 222 $this->table->generate($new_list);<br />
 223 <br />
 224 // Generates a table with this prototype<br />
 225 <br />
 226 &lt;table border="0" cellpadding="4" cellspacing="0"&gt;<br />
 227 &lt;tr&gt;<br />
 228 &lt;td&gt;one&lt;/td&gt;&lt;td&gt;two&lt;/td&gt;&lt;td&gt;three&lt;/td&gt;<br />
 229 &lt;/tr&gt;&lt;tr&gt;<br />
 230 &lt;td&gt;four&lt;/td&gt;&lt;td&gt;five&lt;/td&gt;&lt;td&gt;six&lt;/td&gt;<br />
 231 &lt;/tr&gt;&lt;tr&gt;<br />
 232 &lt;td&gt;seven&lt;/td&gt;&lt;td&gt;eight&lt;/td&gt;&lt;td&gt;nine&lt;/td&gt;<br />
 233 &lt;/tr&gt;&lt;tr&gt;<br />
 234 &lt;td&gt;ten&lt;/td&gt;&lt;td&gt;eleven&lt;/td&gt;&lt;td&gt;twelve&lt;/td&gt;&lt;/tr&gt;<br />
 235 &lt;/table&gt;</code>
 236
 237
 238
 239 <h2>$this->table->set_template()</h2>
 240
 241 <p>Permits you to set your template. You can submit a full or partial template.</p>
 242
 243 <code>
 244 $tmpl =  array ( 'table_open'&nbsp;&nbsp;=> '&lt;table border="1" cellpadding="2" cellspacing="1" class="mytable">' );<br />
 245
 246 <br />
 247 $this->table->set_template($tmpl);
 248 </code>
 249
 250
 251 <h2>$this->table->set_empty()</h2>
 252
 253 <p>Let's you set a default value for use in any table cells that are empty.  You might, for example, set a non-breaking space:</p>
 254
 255 <code>
 256 $this->table->set_empty("&amp;nbsp;");
 257 </code>
 258
 259 <h2>$this->table->clear()</h2>
 260
 261 <p>Lets you clear the table heading and row data.  If you need to show multiple tables with different data you should
 262 to call this function after each table has been generated to empty the previous table information. Example:</p>
 263
 264 <code>
 265 $this->load->library('table');<br />
 266 <br />
 267 $this->table->set_heading('Name', 'Color', 'Size');<br />
 268 $this->table->add_row('Fred', 'Blue', 'Small');<br />
 269 $this->table->add_row('Mary', 'Red', 'Large');<br />
 270 $this->table->add_row('John', 'Green', 'Medium');<br />
 271 <br />
 272 echo $this->table->generate();<br />
 273 <br />
 274 <kbd>$this->table->clear();</kbd><br />
 275 <br />
 276 $this->table->set_heading('Name', 'Day', 'Delivery');<br />
 277 $this->table->add_row('Fred', 'Wednesday', 'Express');<br />
 278 $this->table->add_row('Mary', 'Monday', 'Air');<br />
 279 $this->table->add_row('John', 'Saturday', 'Overnight');<br />
 280 <br />
 281 echo $this->table->generate();
 282 </code>
 283
 284 <h2>$this->table->function</h2>
 285
 286 <p>Allows you to specify a native PHP function or a valid function array object to be applied to all cell data.</p>
 287
 288 <code>$this->load->library('table');<br />
 289 <br />
 290 $this->table->set_heading('Name', 'Color', 'Size');<br />
 291 $this->table->add_row('Fred', '&lt;strong&gt;Blue&lt;/strong&gt;', 'Small');<br />
 292 <br />
 293 $this->table->function = 'htmlspecialchars';<br />
 294 echo $this->table->generate();<br />
 295 </code>
 296
 297 <p>In the above example, all cell data would be ran through PHP's <dfn>htmlspecialchars()</dfn> function, resulting in:</p>
 298
 299 <code>&lt;td&gt;Fred&lt;/td&gt;&lt;td&gt;&amp;lt;strong&amp;gt;Blue&amp;lt;/strong&amp;gt;&lt;/td&gt;&lt;td&gt;Small&lt;/td&gt;</code>
 300 </div>
 301 <!-- END CONTENT -->
 302
 303
 304 <div id="footer">
 305 <p>
 306 Previous Topic:&nbsp;<a href="ftp.html">&nbsp;FTP Class</a>&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
 307 <a href="#top">Top of Page</a>&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
 308 <a href="../index.html">User Guide Home</a>&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
 309 Next Topic:&nbsp;&nbsp;<a href="image_lib.html">Image Manipulation Class</a>
 310 </p>
 311 <p><a href="http://codeigniter.com">CodeIgniter</a> &nbsp;&middot;&nbsp; Copyright &#169; 2006 - 2011 &nbsp;&middot;&nbsp; <a href="http://ellislab.com/">EllisLab, Inc.</a></p>
 312 </div>
 313
 314 </body>
 315 </html>