Send range from Google spreadsheet as Email (formatting issue)

Question

The following code sends out an email for data in columns 2 and 3, however the results in email are not one below another.

Code.gs
function email() {

  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var bulk = ss.getSheetByName("Bulk");
  var lastrow = bulk.getLastRow();

  var data1 = bulk.getRange(1, 2, lastrow).getValues();
  var data2 = bulk.getRange(1, 3, lastrow).getValues();

  var onedata="", twodata="";

  for (var i =1; i < data1.length; i++) {
    if (onedata.length) {
              onedata += ", ";
    }
   onedata += data1[i] 
  }

  for (var i =1; i < data2.length; i++) {
    if (twodata.length) {
              twodata += ", ";
    }
   twodata += data2[i] 
  }

  var report = ""

  report += "<tr><td style='padding:5px'>" + onedata + "</td><td style='padding:5px'>" + twodata + "</td></tr>";


  report ="<table><tr><th'>First data</th><th>Second data</th></tr>" + report + "</table>";

  MailApp.sendEmail(Session.getActiveUser().getEmail(),
                    "Your report", report, {htmlBody: report});

  }

Results received in email

First data                  Second data
Apple, Orange, Grapes,      Red, Orange, Green, Yellow,
Banana, Chickoo             Grey

Result expected

First data  Second data
Apple       Red
Orange      Orange
Grapes      Green
Banana      Yellow
Chickoo     Grey

Answer 1

you made a little mistake with the for loop.

here your code with some little modifications:

function email() {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var bulk = ss.getSheetByName("Bulk");
  var lastrow = bulk.getLastRow();

  var data1 = bulk.getRange(1, 2, lastrow).getValues(); // fruit column
  var data2 = bulk.getRange(1, 3, lastrow).getValues(); // color column

  var report = ""
  var fruitTable ="";
  for(var i in data1){
    if(data1[i]!="") fruitTable += "<tr><td style='padding:5px'>" + data1[i] + "</td><td style='padding:5px'>" + data2[i] + "</td></tr>";
  }

  report ="<table><tr><th>First data</th><th>Second data</th></tr>" + fruitTable + "</table>";

  MailApp.sendEmail(Session.getActiveUser().getEmail(),
                    "Your report", report, {htmlBody: report});
}

I hope this will respond to your needs.
Harold

Answer 2

the table construction had a few errors, Below is a code with a simpler loop, feel free to adapt it the way you want... as it is it added a few features I used to make my tests easier... (style + conditions)

function email() {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var bulk = ss.getSheetByName("Bulk");
  var lastrow = bulk.getLastRow();
  var data = bulk.getRange(1, 2, lastrow,2).getValues();  
  var tableData = "<table border=1><th>First data</th><th>Second data</th>"

  for (var i =1; i < data.length; i++) {
    var d1=data[i][0]==''?'empty ':data[i][0];
    var d2=data[i][1]==''?'empty ':data[i][1];
    tableData+="<tr><td>"+d1+"</td><td>"+d2+"</td></tr>"
  }
  tableData+="</table>";

  MailApp.sendEmail(Session.getActiveUser().getEmail(),
                    "Your report", "html only", {htmlBody: tableData});
}

---

EDIT :

Taking advantage of Harold's answer I added a few styles to make it more "sexy" ;-)

function email() {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var bulk = ss.getSheetByName("Bulk");
  var lastrow = bulk.getLastRow();
  var data = bulk.getRange(1, 2, lastrow,2).getValues();  
  var tableData = '<TABLE style="border-collapse:collapse;"border = 1 cellpadding = 5 ><th style=color:blue>First data</th><th style=color:green>Second data</th>'

  for (var i =1; i < data.length; i++) {
    var d1=data[i][0]==''?'empty':data[i][0];
    var d2=data[i][1]==''?'empty':data[i][1];
    tableData+="<tr><td style=color:blue>"+d1+"</td><td style=color:green>"+d2+"</td></tr>"
  }
  tableData+="</table>";

  MailApp.sendEmail(Session.getActiveUser().getEmail(),
                    "Your report", "html only", {htmlBody: tableData});
}