Location: PHPKode > projects > Open Power Template > docs/Opt/guide.sections.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<meta name="robots" content="all" />

	<title>Working with sections - Open Power Template</title>
	
	<link rel="stylesheet" type="text/css" href="design/generic.css" media="all"  />
	<link rel="stylesheet" type="text/css" href="design/print.css" media="print" />
	<!--[if lte IE 6]><link rel="stylesheet" href="design/ie.css" type="text/css" /><![endif]-->	
	<!--[if IE 7]><link rel="stylesheet" href="design/ie7.css" type="text/css" /><![endif]-->
</head>
<body>

<div id="wrap">
	<div id="header">
		<h1>Open Power Template 2.0</h1>
		<h2>Working with sections</h2>
		<p class="generated">@ 02.09.2010</p>
		<p class="location"><a href="index.html"><strong>User manual</strong></a> &raquo; <a href="guide.html">Programmer's Guide</a> &raquo; <a href="guide.sections.html">Working with sections</a></p>
	</div>
	
	<div id="content"><dl class="location"><dt><a href="guide.html">4. Programmer's Guide</a><br/>4.5. Working with sections</dt><dd class="prev">4.4. Error handling<br/><a href="guide.error-handling.html">&laquo; Previous</a></dd><dd class="next">4.6. Data formats<br/><a href="guide.data-formats.html">Next &raquo;</a></dd></dl>	<h1>4.5. Working with sections</h1><p>Sections can be considered as <em>smart loops</em>. On the template side, they allow to avoid dealing with the implementation issues, such as iterating through the data structure, checking the existence of elements etc. More about section features can be found in the <a href="syntax.topics.sections.html" title="3.9.1. Sections">Sections</a> chapter and here we are going to describe, how to use them on the script side.</p>

<h2>Basic overview</h2>

<p>Suppose we want to display a list of comments on our blog. We must specify, how a single comment should look like and where to display particular item variables:</p>

<pre class="xml"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h2<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Comments<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h2<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:show</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;comments&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>There are {$commentNum} comments.<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:section<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
        <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;div</span> <span style="color: #000066;">class</span>=<span style="color: #ff0000;">&quot;comment&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
            <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;p</span> <span style="color: #000066;">class</span>=<span style="color: #ff0000;">&quot;author&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>Written by {$comments.author} on {$comments.date}<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
&nbsp;
            {$comments.body}
        <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/div<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:section<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
&nbsp;
    <span style="color: #808080; font-style: italic;">&lt;!-- the alternative content, if there are no comments --&gt;</span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:showelse<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Nobody has written a comment yet! Be first!<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:showelse<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:show<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre>

<p>To populate a section, we must create a template variable with the same name as the section:</p>

<pre class="php"><span style="color: #000088;">$view</span> <span style="color: #339933;">=</span> <span style="color: #000000; font-weight: bold;">new</span> Opt_View<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'comments.tpl'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #000088;">$view</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">commentNum</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">3</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$view</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">comments</span> <span style="color: #339933;">=</span> <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span>0 <span style="color: #339933;">=&gt;</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'author'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'John'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'date'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Mar 13 2009'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'body'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Nice article!'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'author'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Adam'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'date'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Mar 15 2009'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'body'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Thanks a lot, it was very helpful'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'author'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Susan'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'date'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Mar 17 2009'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'body'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'One small suggestion... '</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre>

<p>As you see, the variable <code>comments</code> is an array of arrays. Each sub-array represents the data of a single comment. If the main array is empty or we do not set the variable, the user will see <em>Nobody has written a comment yet! Be first!</em></p>

<blockquote class="warning">
  <p>By default, the section items must be enumerated from 0 and the indices must not contain any holes, like <code>3, 4, 6</code>. Using a database row index is a <em>bad</em> choice.</p>
</blockquote>

<h2>Relationships</h2>

<p>Two nested sections can be connected with a one-to-many relationship. It means that their data somehow depend one by another:</p>

<pre class="xml"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h1<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Categories<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h1<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
&nbsp;
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Below, you can find a list of the categories and the products associated with them.<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
&nbsp;
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:section</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;categories&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h2<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>{$categories.name}<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h2<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>{$categories.description}<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:show</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;products&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Products:<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/p<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;ul<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
        <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;li</span> <span style="color: #000066;">opt:section</span>=<span style="color: #ff0000;">&quot;products&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>{$products.name}<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/li<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/ul<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:showelse<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>There are no products in this category.<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:showelse<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:show<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:section<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre>

<p>OPT automatically connects two nested sections with a relationship and we must provide proper data for them in our script. By default, it is done by creating two variables, one for each section and populating it separately:</p>

<pre class="php"><span style="color: #000088;">$view</span> <span style="color: #339933;">=</span> <span style="color: #000000; font-weight: bold;">new</span> Opt_View<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'categories.tpl'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$view</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">categories</span> <span style="color: #339933;">=</span> <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span>0 <span style="color: #339933;">=&gt;</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Fruit'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'description'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Our best fruit!'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Vegetables'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'description'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Vegetables from the best farms.'</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #000088;">$view</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">products</span> <span style="color: #339933;">=</span> <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #cc66cc;">0</span> <span style="color: #339933;">=&gt;</span>
    <span style="color: #666666; font-style: italic;">// Products in &quot;Fruit&quot;</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span>0 <span style="color: #339933;">=&gt;</span>
        <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Apples'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
        <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Pears'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
        <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Bananas'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <span style="color: #666666; font-style: italic;">// Products in &quot;Vegetables&quot;</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span>0 <span style="color: #339933;">=&gt;</span>
        <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Tomatos'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
        <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Onions'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
        <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'name'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Carrots'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre>

<p>In <code>products</code>, we provide a separate list of products for each category listed in <code>categories</code>. The items are matched by the array indices.</p>

<h2>Using opt:tree</h2>

<p>OPT provides a special section instruction to render hierarchical data structures (trees), <a href="syntax.instructions.tree.html" title="3.7.25. opt:tree">opt:tree</a>:</p>

<pre class="xml"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:tree</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;tree&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:list<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;ul<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;opt:content</span> <span style="color: #000000; font-weight: bold;">/&gt;</span><span style="color: #000000; font-weight: bold;">&lt;/ul<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/opt:list<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:node<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;li<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>{$tree.title} <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:content</span> <span style="color: #000000; font-weight: bold;">/&gt;</span><span style="color: #000000; font-weight: bold;">&lt;/li<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/opt:node<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>  
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:tree<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre>

<p>They are only a different type of sections and we can apply the same rules to them, as to the other types. However, <code>opt:tree</code> has one special requirement in order to work. We must provide somehow the data that describe, what element is nested in whom. We may achieve it by adding a special variable to the tree item, <code>depth</code>:</p>

<pre class="php"><span style="color: #000088;">$view</span> <span style="color: #339933;">=</span> <span style="color: #000000; font-weight: bold;">new</span> Opt_View<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'tree.tpl'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #000088;">$view</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">tree</span> <span style="color: #339933;">=</span> <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span>0 <span style="color: #339933;">=&gt;</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Main category 1'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 0<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Main category 2'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 0<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Subcategory 2.1'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 1<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Main category 3'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 0<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Subcategory 3.1'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 1<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Item 3.1.1'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 2<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Item 3.1.2'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 2<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Item 3.1.3'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 2<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Subcategory 3.2'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 1<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Subcategory 3.3'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 1<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Item 3.3.1'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 2<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Main category 4'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 0<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Subcategory 4.1'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 1<span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Item 4.1.1'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'depth'</span> <span style="color: #339933;">=&gt;</span> 2<span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre>

<p>Now we get a tree with the items nested properly.</p>

<p>The tree checks the validity of the <code>depth</code> element items. Firstly, it determines the initial depth, taken from the first element. In the case above, the initial depth is 0. You may choose the other initial depths, such as <code>1</code> or <code>533</code>, too. In the next elements, the depth must be greater or equal to the initial depth. If it becomes lower for some reason, the template would throw an exception.</p>

<h2>Using opt:selector</h2>

<p><a href="syntax.instructions.selector.html" title="3.7.20. opt:selector">opt:selector</a> is a combination of ordinary sections and the <em>switch</em> statement. It allows to define several possible ways to render an item and automatically chooses between them. Let's take a look at the menu. We have there some entitled URL-s, but we want also to show horizontal lines between the groups of items, and moreover, one of the items must be marked as the <em>currently viewed</em>. <code>opt:selector</code> is the best choice for this task:</p>

<pre class="xml"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;div</span> <span style="color: #000066;">id</span>=<span style="color: #ff0000;">&quot;menu&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;ul<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:selector</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;menu&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
        <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:active<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;li</span> <span style="color: #000066;">class</span>=<span style="color: #ff0000;">&quot;active&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span><span style="color: #000000; font-weight: bold;">&lt;a</span> <span style="color: #000066;">parse:href</span>=<span style="color: #ff0000;">&quot;$menu.address&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>{$menu.title}<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/a<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/li<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/opt:active<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
        <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:horiz<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;li</span> <span style="color: #000066;">class</span>=<span style="color: #ff0000;">&quot;horiz&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #ddbb00;">&amp;nbsp;</span><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/li<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/opt:horiz<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
        <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;opt:default<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;li<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;a</span> <span style="color: #000066;">parse:href</span>=<span style="color: #ff0000;">&quot;$menu.address&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>{$menu.title}<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/a<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/li<span style="color: #000000; font-weight: bold;">&gt;</span></span><span style="color: #000000; font-weight: bold;">&lt;/opt:default<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/opt:selector<span style="color: #000000; font-weight: bold;">&gt;</span></span></span> 
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/ul<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/div<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre>

<p>In order to populate a selector, we must provide an extra variable to each item that indicates the requested way to display it. It must match the name of one of OPT tags within the selector (without the namespace):</p>

<pre class="php"><span style="color: #000088;">$view</span> <span style="color: #339933;">=</span> <span style="color: #000000; font-weight: bold;">new</span> Opt_View<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'menu.tpl'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$view</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">menu</span> <span style="color: #339933;">=</span> <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span>0 <span style="color: #339933;">=&gt;</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'item'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'default'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Index'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'address'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'#'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'item'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'active'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Login'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'address'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'#'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'item'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'default'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Register'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'address'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'#'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'item'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'horiz'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'item'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'default'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Articles'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'address'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'#'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
    <a href="http://www.php.net/array"><span style="color: #990000;">array</span></a><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'item'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'default'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'title'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'Contact'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'address'</span> <span style="color: #339933;">=&gt;</span> <span style="color: #0000ff;">'#'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre>

<p>Note that <code>$menu.item</code> does not have to be named <code>item</code>. You can control, what variable to take the item type from, using <code>test</code> attribute on the <code>opt:selector</code> attribute.</p>

<h2>Are arrays the only way to populate a section?</h2>

<p>No at all. In this chapter we have shown the default way of populating sections that uses ordinary arrays, but the sections are much more flexible. In the next chapters, you will meet the concept of <em>data formats</em> that allow the sections to support anything you want.</p>

<h2>Conclusion</h2>

<p>Sections are very flexible OPT constructs and we recommend to use them rather than <code>opt:foreach</code> or <code>opt:for</code>.</p>
<h4>See also:</h4><ul><li><a href="syntax.topics.sections.html">3.9.1. Sections</a></li></ul><dl class="location location-bottom"><dt>4.5. Working with sections<br/><a href="guide.html">4. Programmer's Guide</a></dt><dd class="prev"><a href="guide.error-handling.html">&laquo; Previous</a><br/>4.4. Error handling</dd><dd class="next"><a href="guide.data-formats.html">Next &raquo;</a><br/>4.6. Data formats</dd></dl>		</div>
	
	<div id="footer">
		<p>Copyright &copy; <a href="http://www.invenzzia.org/">Invenzzia Group 2008-2009</a></p>
		<p>Available under the terms of license: <a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation License 1.2</a></p>
		<p>Generated by <strong>TypeFriendly 0.1.4</strong> by <a href="http://www.invenzzia.org/">Invenzzia</a></p>
	</div>
</div>

</body>
</html>
Return current item: Open Power Template