Doc update

2026-04-29 21:48:45 +02:00 · 2021-09-28 17:35:33 +02:00
parent c02f3202d9
commit 6e9c6eeb23
86 changed files with 6314 additions and 18756 deletions
--- a/.doc/UI/build/html/TwigBaseTuto/Step3/Step3.html
+++ b/.doc/UI/build/html/TwigBaseTuto/Step3/Step3.html
@@ -1,19 +1,21 @@
 <!DOCTYPE html>
-<html class="writer-html4" lang="en" >
+<html class="writer-html5" lang="en" >
 <head>
-  <meta charset="utf-8" />
+  <meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />
+
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>3. Passing variables to templates &mdash; iTop UI 3.0.0 documentation</title><link rel="stylesheet" href="../../_static/css/theme.css" type="text/css" />
-    <link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
+  <title>3. Passing variables to templates &mdash; iTop UI 3.0.0 documentation</title>
+      <link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
+      <link rel="stylesheet" href="../../_static/css/theme.css" type="text/css" />
      <link rel="stylesheet" href="../../_static/css/ui-doc.css" type="text/css" />
  <!--[if lt IE 9]>
    <script src="../../_static/js/html5shiv.min.js"></script>
  <![endif]-->
-  <script id="documentation_options" data-url_root="../../" src="../../_static/documentation_options.js"></script>
-        <script type="text/javascript" src="../../_static/jquery.js"></script>
-        <script type="text/javascript" src="../../_static/underscore.js"></script>
-        <script type="text/javascript" src="../../_static/doctools.js"></script>
-        <script type="text/javascript" src="../../_static/language_data.js"></script>
+  
+        <script data-url_root="../../" id="documentation_options" src="../../_static/documentation_options.js"></script>
+        <script src="../../_static/jquery.js"></script>
+        <script src="../../_static/underscore.js"></script>
+        <script src="../../_static/doctools.js"></script>
    <script src="../../_static/js/theme.js"></script>
    <link rel="index" title="Index" href="../../genindex.html" />
    <link rel="search" title="Search" href="../../search.html" />
@@ -26,7 +28,8 @@
    <nav data-toggle="wy-nav-shift" class="wy-nav-side">
      <div class="wy-side-scroll">
        <div class="wy-side-nav-search" >
-            <a href="../../index.html" class="icon icon-home"> iTop UI<img src="../../_static/itop-logo.png" class="logo" alt="Logo"/>
+            <a href="../../index.html" class="icon icon-home"> iTop UI
+            <img src="../../_static/itop-logo.png" class="logo" alt="Logo"/>
          </a>
 <div role="search">
  <form id="rtd-search-form" class="wy-form" action="../../search.html" method="get">
@@ -36,7 +39,7 @@
  </form>
 </div>
        </div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
-              <p class="caption"><span class="caption-text">Twig Base:</span></p>
+              <p class="caption" role="heading"><span class="caption-text">Twig Base:</span></p>
 <ul class="current">
 <li class="toctree-l1"><a class="reference internal" href="../../TwigBase/TwigBase.html">Twig Base Presentation</a></li>
 <li class="toctree-l1 current"><a class="reference internal" href="../TwigBaseTuto.html">Twig Base Tutorial</a><ul class="current">
@@ -48,7 +51,7 @@
 </li>
 <li class="toctree-l1"><a class="reference internal" href="../../TwigBaseReference/TwigBaseReference.html">Twig Base Reference</a></li>
 </ul>
-<p class="caption"><span class="caption-text">Tags reference:</span></p>
+<p class="caption" role="heading"><span class="caption-text">Tags reference:</span></p>
 <ul>
 <li class="toctree-l1"><a class="reference internal" href="../../generated/Component/Component.html">UI Components</a></li>
 <li class="toctree-l1"><a class="reference internal" href="../../generated/Layout/Layout.html">UI Layouts</a></li>
@@ -79,130 +82,86 @@
          <div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
           <div itemprop="articleBody">
             
-  <div class="section" id="passing-variables-to-templates">
-<span id="step3"></span><h1>3. Passing variables to templates<a class="headerlink" href="#passing-variables-to-templates" title="Permalink to this headline">¶</a></h1>
+  <section id="passing-variables-to-templates">
+<span id="step3"></span><h1>3. Passing variables to templates<a class="headerlink" href="#passing-variables-to-templates" title="Permalink to this headline"></a></h1>
 <p>We have seen in <a class="reference internal" href="../Step2/Step2.html#step2"><span class="std std-ref">2. Hello World!</span></a> how to create a static template. Let’s send some variables to have a more dynamic display.</p>
 <div class="literal-block-wrapper docutils container" id="id1">
-<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id1" title="Permalink to this code">¶</a></div>
-<div class="highlight-php notranslate"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre> 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
-10
-11
-12
-13
-14
-15</pre></div></td><td class="code"><div class="highlight"><pre><span></span><span class="cp">&lt;?php</span>
-
-<span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule\Controller</span><span class="p">;</span>
-<span class="k">use</span> <span class="nx">Combodo\iTop\Application\TwigBase\Controller\Controller</span><span class="p">;</span>
-<span class="k">use</span> <span class="nx">UserRights</span><span class="p">;</span>
-
-<span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
-<span class="p">{</span>
-    <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationHelloWorld</span><span class="p">()</span>
-    <span class="p">{</span>
-        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sName&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nx">UserRights</span><span class="o">::</span><span class="na">GetUser</span><span class="p">();</span>
-        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sDate&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">&quot;r&quot;</span><span class="p">);</span>
-        <span class="nv">$this</span><span class="o">-&gt;</span><span class="na">DisplayPage</span><span class="p">(</span><span class="nv">$aParams</span><span class="p">);</span>
-    <span class="p">}</span>
-<span class="p">}</span>
+<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id1" title="Permalink to this code"></a></div>
+<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="o">&lt;?</span><span class="nx">php</span>
+<span class="linenos"> 2</span>
+<span class="linenos"> 3</span><span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule\Controller</span><span class="p">;</span>
+<span class="linenos"> 4</span><span class="k">use</span> <span class="nx">Combodo\iTop\Application\TwigBase\Controller\Controller</span><span class="p">;</span>
+<span class="linenos"> 5</span><span class="k">use</span> <span class="nx">UserRights</span><span class="p">;</span>
+<span class="linenos"> 6</span>
+<span class="linenos"> 7</span><span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
+<span class="linenos"> 8</span><span class="p">{</span>
+<span class="linenos"> 9</span>    <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationHelloWorld</span><span class="p">()</span>
+<span class="linenos">10</span>    <span class="p">{</span>
+<span class="linenos">11</span>        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sName&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nx">UserRights</span><span class="o">::</span><span class="na">GetUser</span><span class="p">();</span>
+<span class="linenos">12</span>        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sDate&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">&quot;r&quot;</span><span class="p">);</span>
+<span class="linenos">13</span>        <span class="nv">$this</span><span class="o">-&gt;</span><span class="na">DisplayPage</span><span class="p">(</span><span class="nv">$aParams</span><span class="p">);</span>
+<span class="linenos">14</span>    <span class="p">}</span>
+<span class="linenos">15</span><span class="p">}</span>
 </pre></div>
-</td></tr></table></div>
+</div>
 </div>
 <p>The <code class="docutils literal notranslate"><span class="pre">DisplayPage()</span></code> method accept an array of parameters. This array is transformed into variables for the Twig template.</p>
 <p>Here two variables are created: <code class="docutils literal notranslate"><span class="pre">sName</span></code> and <code class="docutils literal notranslate"><span class="pre">sDate</span></code>, we can use them in the template.</p>
 <div class="literal-block-wrapper docutils container" id="id2">
-<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id2" title="Permalink to this code">¶</a></div>
-<div class="highlight-twig notranslate"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre>1
-2
-3
-4</pre></div></td><td class="code"><div class="highlight"><pre><span></span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:&#39;Hello &#39;</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">&#39;!&#39;</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
-<span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">&#39;date&#39;</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
-<span class="x">    We are currently </span><span class="cp">{{</span> <span class="nv">sDate</span> <span class="cp">}}</span><span class="x"></span>
-<span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
+<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id2" title="Permalink to this code"></a></div>
+<div class="highlight-twig notranslate"><div class="highlight"><pre><span></span><span class="linenos">1</span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:&#39;Hello &#39;</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">&#39;!&#39;</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos">2</span><span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">&#39;date&#39;</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos">3</span><span class="x">    We are currently </span><span class="cp">{{</span> <span class="nv">sDate</span> <span class="cp">}}</span><span class="x"></span>
+<span class="linenos">4</span><span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
 </pre></div>
-</td></tr></table></div>
+</div>
 </div>
 <p>The output is then</p>
 <img alt="../../_images/Hello2.png" src="../../_images/Hello2.png" />
 <p>The variables can be of any type, for example you can give an array as a variable:</p>
 <div class="literal-block-wrapper docutils container" id="id3">
-<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id3" title="Permalink to this code">¶</a></div>
-<div class="highlight-php notranslate"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre> 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
-10
-11
-12
-13
-14
-15
-16</pre></div></td><td class="code"><div class="highlight"><pre><span></span><span class="cp">&lt;?php</span>
-
-<span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule\Controller</span><span class="p">;</span>
-<span class="k">use</span> <span class="nx">Combodo\iTop\Application\TwigBase\Controller\Controller</span><span class="p">;</span>
-<span class="k">use</span> <span class="nx">UserRights</span><span class="p">;</span>
-
-<span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
-<span class="p">{</span>
-    <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationHelloWorld</span><span class="p">()</span>
-    <span class="p">{</span>
-        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sName&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nx">UserRights</span><span class="o">::</span><span class="na">GetUser</span><span class="p">();</span>
-        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sDate&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">&quot;r&quot;</span><span class="p">);</span>
-        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;aQuarter&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="p">[</span><span class="s1">&#39;January&#39;</span><span class="p">,</span> <span class="s1">&#39;February&#39;</span><span class="p">,</span> <span class="s1">&#39;March&#39;</span><span class="p">];</span>
-        <span class="nv">$this</span><span class="o">-&gt;</span><span class="na">DisplayPage</span><span class="p">(</span><span class="nv">$aParams</span><span class="p">);</span>
-    <span class="p">}</span>
-<span class="p">}</span>
+<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id3" title="Permalink to this code"></a></div>
+<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="o">&lt;?</span><span class="nx">php</span>
+<span class="linenos"> 2</span>
+<span class="linenos"> 3</span><span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule\Controller</span><span class="p">;</span>
+<span class="linenos"> 4</span><span class="k">use</span> <span class="nx">Combodo\iTop\Application\TwigBase\Controller\Controller</span><span class="p">;</span>
+<span class="linenos"> 5</span><span class="k">use</span> <span class="nx">UserRights</span><span class="p">;</span>
+<span class="linenos"> 6</span>
+<span class="linenos"> 7</span><span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
+<span class="linenos"> 8</span><span class="p">{</span>
+<span class="linenos"> 9</span>    <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationHelloWorld</span><span class="p">()</span>
+<span class="linenos">10</span>    <span class="p">{</span>
+<span class="linenos">11</span>        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sName&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nx">UserRights</span><span class="o">::</span><span class="na">GetUser</span><span class="p">();</span>
+<span class="linenos">12</span>        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;sDate&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">&quot;r&quot;</span><span class="p">);</span>
+<span class="linenos">13</span>        <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;aQuarter&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="p">[</span><span class="s1">&#39;January&#39;</span><span class="p">,</span> <span class="s1">&#39;February&#39;</span><span class="p">,</span> <span class="s1">&#39;March&#39;</span><span class="p">];</span>
+<span class="linenos">14</span>        <span class="nv">$this</span><span class="o">-&gt;</span><span class="na">DisplayPage</span><span class="p">(</span><span class="nv">$aParams</span><span class="p">);</span>
+<span class="linenos">15</span>    <span class="p">}</span>
+<span class="linenos">16</span><span class="p">}</span>
 </pre></div>
-</td></tr></table></div>
+</div>
 </div>
 <p>Here <code class="docutils literal notranslate"><span class="pre">aQuarter</span></code> is an array containing some months, we can use it in a selector:</p>
 <div class="literal-block-wrapper docutils container" id="id4">
-<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id4" title="Permalink to this code">¶</a></div>
-<div class="highlight-twig notranslate"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre> 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
-10
-11
-12
-13</pre></div></td><td class="code"><div class="highlight"><pre><span></span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:&#39;Hello &#39;</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">&#39;!&#39;</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
-<span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">&#39;date&#39;</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
-<span class="x">    We are currently </span><span class="cp">{{</span> <span class="nv">sDate</span> <span class="cp">}}</span><span class="x"></span>
-<span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
-
-<span class="cp">{%</span> <span class="k">UIForm</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="nv">sId</span><span class="s1">:&#39;my-form&#39;</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
-<span class="x">    Select Month:</span>
-<span class="x">    </span><span class="cp">{%</span> <span class="k">UISelect</span> <span class="p">F</span><span class="nv">orSelect</span> <span class="o">{</span><span class="nv">sName</span><span class="s1">:&#39;month&#39;</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
-<span class="x">        </span><span class="cp">{%</span> <span class="k">for</span> <span class="nv">index</span><span class="o">,</span><span class="nv">sMonth</span> <span class="k">in</span> <span class="nv">aQuarter</span> <span class="cp">%}</span><span class="x"></span>
-<span class="x">            </span><span class="cp">{%</span> <span class="k">UISelectOption</span> <span class="p">F</span><span class="nv">orSelectOption</span> <span class="o">{</span><span class="nv">sValue</span><span class="o">:</span> <span class="nv">index</span><span class="o">,</span> <span class="nv">sLabel</span><span class="o">:</span> <span class="nv">sMonth</span><span class="o">,</span> <span class="nv">bSelected</span><span class="o">:</span><span class="kp">false</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
-<span class="x">        </span><span class="cp">{%</span> <span class="k">endfor</span> <span class="cp">%}</span><span class="x"></span>
-<span class="x">    </span><span class="cp">{%</span> <span class="k">EndUISelect</span> <span class="cp">%}</span><span class="x"></span>
-<span class="cp">{%</span> <span class="k">EndUIForm</span> <span class="cp">%}</span><span class="x"></span>
+<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id4" title="Permalink to this code"></a></div>
+<div class="highlight-twig notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:&#39;Hello &#39;</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">&#39;!&#39;</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos"> 2</span><span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">&#39;date&#39;</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos"> 3</span><span class="x">    We are currently </span><span class="cp">{{</span> <span class="nv">sDate</span> <span class="cp">}}</span><span class="x"></span>
+<span class="linenos"> 4</span><span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos"> 5</span>
+<span class="linenos"> 6</span><span class="cp">{%</span> <span class="k">UIForm</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="nv">sId</span><span class="s1">:&#39;my-form&#39;</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos"> 7</span><span class="x">    Select Month:</span>
+<span class="linenos"> 8</span><span class="x">    </span><span class="cp">{%</span> <span class="k">UISelect</span> <span class="p">F</span><span class="nv">orSelect</span> <span class="o">{</span><span class="nv">sName</span><span class="s1">:&#39;month&#39;</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos"> 9</span><span class="x">        </span><span class="cp">{%</span> <span class="k">for</span> <span class="nv">index</span><span class="o">,</span><span class="nv">sMonth</span> <span class="k">in</span> <span class="nv">aQuarter</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos">10</span><span class="x">            </span><span class="cp">{%</span> <span class="k">UISelectOption</span> <span class="p">F</span><span class="nv">orSelectOption</span> <span class="o">{</span><span class="nv">sValue</span><span class="o">:</span> <span class="nv">index</span><span class="o">,</span> <span class="nv">sLabel</span><span class="o">:</span> <span class="nv">sMonth</span><span class="o">,</span> <span class="nv">bSelected</span><span class="o">:</span><span class="kp">false</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos">11</span><span class="x">        </span><span class="cp">{%</span> <span class="k">endfor</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos">12</span><span class="x">    </span><span class="cp">{%</span> <span class="k">EndUISelect</span> <span class="cp">%}</span><span class="x"></span>
+<span class="linenos">13</span><span class="cp">{%</span> <span class="k">EndUIForm</span> <span class="cp">%}</span><span class="x"></span>
 </pre></div>
-</td></tr></table></div>
+</div>
 </div>
 <p>The output is:</p>
 <img alt="../../_images/Hello3.png" src="../../_images/Hello3.png" />
-</div>
+</section>


           </div>