Format Table in Email GAS

Question

The following code sends an email, with selected row data, I require help in formatting the output table.

function sendemail() {

  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getSheetByName("Visitors Log");
  var user = Session.getActiveUser();
  var activecell = sheet.getActiveCell().getRow();

  var startdate = Utilities.formatDate((sheet.getRange(activecell, 2).getValue()), 'IST', 'dd/MMM/yyyy');
  var enddate = Utilities.formatDate((sheet.getRange(activecell, 3).getValue()), 'IST', 'dd/MMM/yyyy');
      var visitorsname = sheet.getRange(activecell, 4).getValue();
      var designation  = sheet.getRange(activecell, 5).getValue();

      var body =""


      body += "<tr><tr style='padding:5px'>" + startdate + "</tr><tr style='padding:5px'>" + enddate + "</tr><tr style='padding:5px'>" + visitorsname + "</tr><tr style='padding:5px'>" + designation

      MailApp.sendEmail(user,"Visitor Details",body,{htmlBody: body, cc:'xxx@gmail.com'});

    }

Email Received

17/Feb/2014
23/Feb/2014
Vasim
Manager

Email Required

Start Date     17/Feb/2014
End Date       23/Feb/2014
Visitor's Name Vasim
Designation    Manager

Hard-coded headers will be great and Yes if I can get some colorful background as well. (Loop in sheet not requried as I have some more variable defined)

Answer 1

here your code with a few changes:

function sendemail() {
  var ss = SpreadsheetApp.getActiveSheet();
  //  var ss = SpreadsheetApp.getActiveSpreadsheet();
  //  var sheet = ss.getSheetByName("Visitors Log");
  var user = Session.getActiveUser();
  var row = ss.getActiveCell().getRow();
  //  var activecell = sheet.getActiveCell().getRow();
  var vals = ss.getRange(row, 2, 1, 4).getValues();

  var startdate = Utilities.formatDate(new Date(vals[0][0]), 'IST', 'dd/MMM/yyyy');
  var enddate = Utilities.formatDate(new Date(vals[0][1]), 'IST', 'dd/MMM/yyyy');
  var visitorsname = vals[0][2];
  var designation  = vals[0][3];

  var body =""

  var thStyle = "padding:5px;";
  var tdStyle = "font-style:oblique;background-color:#BDBDBD";
  var tableStyle = "border:1px"

      body += "<table style='"+tableStyle+"'><tr>"+
        "<th style='"+thStyle+"'>Start Date </th>"+
          "<td style='"+tdStyle+"'>"+startdate + "</td></tr>"+
            "<tr><th style='"+thStyle+"'>End Date </th>" +
              "<td style='"+tdStyle+"'>"+enddate + "</td></tr>"+
                "<tr><th style='"+thStyle+"'>Visitor's Name</th>"+
                  "<td style='"+tdStyle+"'>"+visitorsname +"</td></tr>"+
                    "<tr><th style='"+thStyle+"'>Designation</th>"+
                      "<td style='"+tdStyle+"'>"+designation+"</td></tr>"+
                        "</table>";
  var cc="";

  MailApp.sendEmail(user,"Visitor Details",body,{htmlBody: body, cc:cc});

}

Answer 2

Try this body

body += "<table><tr><td>Start Date</td><td>" + startdate + "</td></tr>"+
"<tr><td>End Date</td><td>" + enddate + "</td></tr>"+
"<tr><td>Visitor's Name</td><td>" + visitorsname + "</td></tr>"+
"<tr><td>Destination</td><td>" + designation+ "</td></tr></table>";

Of course you can use templates evaluating some files check here.