title: Dynamic binding of table column and rows
body: <p>I'm having troubles getting dynamic binding of both my table columns and rows to work.</p>
  
  <p>Suppose I have two models, one holding the table column info:</p>
  
  <pre><code>    var aColumnData = [
          {
              columnId : "col1"
          },
          {
              columnId : "col2"
          },
          {
              columnId : "col3"
          },
          {
              columnId : "col4"
          },
          {
              columnId : "col5"
          }
      ];
  </code></pre>
  
  <p>and one with the data:</p>
  
  <pre><code>var aData = [
      {
          col1 : "Row 1 col 1",
          col2 : "Row 1 col 2",
          col3 : "Row 1 col 3",
          col4 : "Row 1 col 4",
          col5 : "Row 1 col 5"
      },
      {
          col1 : "Row 2 col 1",
          col2 : "Row 2 col 2",
          col3 : "Row 2 col 3",
          col4 : "Row 2 col 4",
          col5 : "Row 2 col 5"
      }
  ];
  </code></pre>
  
  <p>I then set the model :</p>
  
  <pre><code>    var oModel = new sap.ui.model.json.JSONModel();
      oModel.setData({
          columns : aColumnData,
          rows    : aData
      });
  </code></pre>
  
  <p>I then create my table in the view:</p>
  
  <pre><code>    var oTable = new sap.ui.table.Table();
  
      var oColumnTemplate = new sap.ui.table.Column({
          label : "{columnDesc}",
          template : new sap.ui.commons.TextView().bindProperty("text", "&lt;this_should_be_dynamic_but_how?&gt;")
      });
  
      oTable.bindColumns("/columns", oColumnTemplate);
      oTable.bindRows("/rows");
  </code></pre>
  
  <p>The part that bugs me is the binding to the current column in the TextView template; this should be dynamic ("col1", "col2", etc) and done on the fly -- that's what bindings are for anyway I assume -- but I can't get it to work...</p>
  
  <p>I guess I'm missing something simple and trivial, but I'm a bit lost now...
  Any help is highly appreciated!</p>
  
  <p>==============================</p>
  
  <p><em>EDIT: I got it to work by iterating through the columns array and using the addColumn() method:</em></p>
  
  <pre><code>    jQuery.each(aColumnData, function(i, v) {
          oTable.addColumn(new sap.ui.table.Column({
              label : v.columnDesc, 
              template: new sap.ui.commons.TextView().bindProperty("text", v.columnId) 
          })); 
      });
  </code></pre>
  
  <p><em>...but I was hoping there would be a more cleaner approach using the bindColumns() / bindRows() approach:</em></p>