title: Populate DataTable from array with specific columns
body: <p>I'm trying to populate DataTable for Google Charts (visualization API) and I have a problem with the loop. Function should get the data from php via ajax and when sucess, add items to the DataTable.</p>
  <pre><code>  $.each(res, function (i, element) {
      var cust = element[&quot;Customer&quot;];
      var prog = element[&quot;progr&quot;];
      var pm = element[&quot;pm&quot;];
      var startd = element[&quot;StartD&quot;];
      var endd = element[&quot;EndD&quot;];
      var data = new google.visualization.DataTable();
      data.addColumn('string', 'Customer');
      data.addColumn('string', 'Customer');
      data.addColumn('string', 'Project Manager');
      data.addColumn('date', 'Start Date');
      data.addColumn('date', 'End Date');
      data.addColumn('number', 'Duration');
      data.addColumn('number', 'Percent Complete');
      data.addColumn('string', 'Dependencies');
      for(var j = 0; j &lt; res.length; j++) 
        data.addRow(
          [cust[j], cust[j], pm[j], new Date('2020', '0', '12'), new Date('2020', '0', '12'), null, prog[j] *100, null]);
  </code></pre>
  <p>I was tring with different setups and instead of addRow with addRows[] as well.
  The result with above code is, that it splits the first Customer name into rows.</p>
  <p><a href="https://i.stack.imgur.com/mlauI.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mlauI.png" alt="enter image description here" /></a></p>
  <p>There are multiple rows in the array. I would like to add all of them to the DataTable and then pass it to the chart.</p>