title: How to loop inside extjs XTemplate
body: <p>Im trying to loop a array with extjs xtemplate and create a table</p>
  
  <pre><code>Ext.define('dataview_model', {
      extend    : 'Ext.data.Model',
      fields  : [
          {name: 'count',            type: 'string'},
          {name: 'maxcolumns',    type: 'string'},
          {name: 'maxrows',        type: 'string'},
          {name: 'numbers',        type: 'array'}
      ]
  });
  
  Ext.create('Ext.data.Store', {
      storeId : 'viewStore',
      model    : 'dataview_model',
      data    : [
          {count: '7', maxcolumns: '10', maxrows: '5', numbers: ['100','200','300','400','500','600','700']}
      ]
  });
  
  var tpl = new Ext.XTemplate(
      '&lt;tpl for="."&gt;',
  
          '&lt;tpl if="count &amp;gt; 0"&gt;',
              '&lt;table class="view_table"&gt;',    
                  '&lt;tpl for="numbers"&gt;',    
                      '&lt;tr&gt;',
                          '&lt;td&gt;{.}&lt;/td&gt;',
                      '&lt;/tr&gt;',
                  '&lt;/tpl&gt;',    
              '&lt;/table&gt;',
          '&lt;/tpl&gt;',
  
      '&lt;/tpl&gt;'
  );
  
  Ext.create('Ext.DataView', {
      width             : 500,
      height            : 200,
      renderTo          : Ext.getBody(),
      store             : Ext.getStore('viewStore'),
      tpl               : tpl    
  });
  </code></pre>
  
  <p>this is the working example which i have so far</p>
  
  <p><a href="http://jsfiddle.net/6HgCd/">http://jsfiddle.net/6HgCd/</a></p>
  
  <p>what i want to do is stop the loop once there is 5 rows and add other values to second column like below</p>
  
  <pre><code>+----+ +----+
  |    | |    |
  +----+ +----+
  +----+ +----+
  |    | |    |
  +----+ +----+
  +----+
  |    |
  +----+
  +----+
  |    |
  +----+
  +----+
  |    |
  +----+
  </code></pre>
  
  <p>any idea how to do this?</p>
  
  <p>Thanks.</p>