Google Documents AppScript - set cell border style for each side

Question

i have a for loop adding rows and cells. I want these cells to have only bottom border, thickness 1pt and black color. What is the best way to do this? the documentation is lacking examples

for (var r = 0; r < rowdata.length; r++) { //loop through data for each row

  var newrow = table.insertTableRow(1+r)

  //add cells and values 
  var cell1 = newrow.appendTableCell(rowdata[r][0])
  var cell2 = newrow.appendTableCell(rowdata[r][1]) 

  //align cell text to center
  var cellStyle = {};
  cellStyle[DocumentApp.Attribute.HORIZONTAL_ALIGNMENT] = DocumentApp.HorizontalAlignment.CENTER;

  cell1.getChild(0).asParagraph().setAttributes(cellStyle)
  cell2.getChild(0).asParagraph().setAttributes(cellStyle)

  
  //set bottom border line width to 1pt, line color to black
  //set the other borders line width to 0pt
  
  ???

}

Answer 1

I believe your goal is as follows.

• When the rows are appended, you want to set the bottom border as 1 pt width and black color, and want to set the other borders as 0 pt width.

In the current stage, it seems that unfortunately, the Google Document service (DocumentApp) cannot manage each border. But, fortunately, when Docs API is used, your goal can be achieved. In this answer, I would like to propose achieving your goal using Docs API. When your script is modified it becomes as follows.

Modified script:

Before you use this script, please enable Google Docs API at Advanced Google services.

function myFunction() {
  var doc = DocumentApp.getActiveDocument(); // Please set your Document.
  var body = doc.getBody();
  var table = body.getTables()[0]; // Please set your table.
  var rowdata = [[,,,],[,,,],,,]; // Please set your values.

  // --- This is your showing script.
  for (var r = 0; r < rowdata.length; r++) {
    var newrow = table.insertTableRow(1 + r);
    var cell1 = newrow.appendTableCell(rowdata[r][0]);
    var cell2 = newrow.appendTableCell(rowdata[r][1]);
    var cellStyle = {};
    cellStyle[DocumentApp.Attribute.HORIZONTAL_ALIGNMENT] = DocumentApp.HorizontalAlignment.CENTER;
    cell1.getChild(0).asParagraph().setAttributes(cellStyle);
    cell2.getChild(0).asParagraph().setAttributes(cellStyle);
  }
  // ---

  doc.saveAndClose();
  var docId = doc.getId();
  var i = body.getChildIndex(table);
  var index = Docs.Documents.get(docId).body.content[i + 1].startIndex;
  var requests = [{ updateTableCellStyle: { tableCellStyle: { borderRight: { dashStyle: "SOLID", width: { magnitude: 0, unit: "PT" }, color: { color: {} } }, borderLeft: { dashStyle: "SOLID", width: { magnitude: 0, unit: "PT" }, color: { color: {} } } }, tableStartLocation: { index }, fields: "borderRight,borderLeft" } }];
  Docs.Documents.batchUpdate({ requests }, doc.getId());
}

• When this script is run, several rows are appended to the table on Document, and the width of vertical borders is changed to 0 pt. By this, only the bottom borders are shown.

References:

• Method: documents.get
• Method: documents.batchUpdate
• UpdateTableCellStyleRequest

Added:

From your following reply,

that is what i am looking for with one difference. The table i am appending to already has some rows that i want to remain unchanged concerning their border style. I want to apply your code to the newly added rows only!

When you wanted to reflect the above request body to the appended rows, how about the following modification?

In your showing script, you are using var newrow = table.insertTableRow(1 + r);. In this case, the rows are put from the 2nd row. Using this script, how about the following sample script?

Sample script:

function myFunction() {
  var doc = DocumentApp.getActiveDocument(); // Please set your Document.
  var body = doc.getBody();
  var table = body.getTables()[0]; // Please set your table.
  var rowdata = [[,,,],[,,,],,,]; // Please set your values.

  // --- This is your showing script.
  for (var r = 0; r < rowdata.length; r++) {
    var newrow = table.insertTableRow(1 + r);
    var cell1 = newrow.appendTableCell(rowdata[r][0]);
    var cell2 = newrow.appendTableCell(rowdata[r][1]);
    var cellStyle = {};
    cellStyle[DocumentApp.Attribute.HORIZONTAL_ALIGNMENT] = DocumentApp.HorizontalAlignment.CENTER;
    cell1.getChild(0).asParagraph().setAttributes(cellStyle);
    cell2.getChild(0).asParagraph().setAttributes(cellStyle);
  }
  // ---

  doc.saveAndClose();
  var docId = doc.getId();
  var i = body.getChildIndex(table);
  var index = Docs.Documents.get(docId).body.content[i + 1].startIndex;

  // I modified this request body.
  var requests = [{ updateTableCellStyle: { tableCellStyle: { borderRight: { dashStyle: "SOLID", width: { magnitude: 0, unit: "PT" }, color: { color: {} } }, borderLeft: { dashStyle: "SOLID", width: { magnitude: 0, unit: "PT" }, color: { color: {} } } }, tableRange: { tableCellLocation: { tableStartLocation: { index }, rowIndex: 1 }, rowSpan: rowdata.length, columnSpan: rowdata[0].length }, fields: "borderRight,borderLeft" } }];

  Docs.Documents.batchUpdate({ requests }, doc.getId());
}

• When this script is run, the vertical lines are removed from the appended rows from the 2nd row.