Search code examples
google-apps-scriptgoogle-docs

Turn off table row overflow across pages


I'm developing a sidebar in Sheets so that I can create photo tables (in Docs, Sheets and Slides) and put comments on them. But I'm stuck on Docs. I can generate a Docs, import the photos into the table and set the number of columns. However, I'd like to disable the table's row overflow between pages, but I don't know how. I've found article referring to my problem but I can't apply it to my development. I hope my question won't be considered a duplicate.

This is my code

      // 1. Création du nouveau fichier Docs
      dossierSauvegarde = DriveApp.getFolderById(tReponse[1]);
      document = DocumentApp.create(tReponse[2]);
      DriveApp.getFileById(document.getId()).moveTo(dossierSauvegarde);

      // 2. Récupération des noms et des id des photos présentes dans le dossier
      body = document.getBody();
      dossierPhotos = DriveApp.getFolderById(tReponse[0]);
      fichiers = dossierPhotos.getFiles();
      while (fichiers.hasNext()) {
        fichier = fichiers.next();
        files.push({name: fichier.getName(), id: fichier.getId()});
      }

      // 3. Création du tableau
      body.insertTable(0);
      tableau = body.getTables();

      // 4. Tri des photos par nom
      files = files.sort(function(a, b){
        nomA = a.name.toUpperCase();
        nomB = b.name.toUpperCase();
        return nomA.localeCompare(nomB);
      });

      // 5. Ajout des lignes avec les photos
      tableau.forEach(table => {
        files.forEach(function(file){
          // 5.1. Récupération de l'id de la photo
          idFile = file.id;
          img = DriveApp.getFileById(idFile);

          // 5.2. Ajout d'une nouvelle ligne
          tr = table.appendTableRow();

          // 5.3. Ajout de la photo
          photo = tr.appendTableCell().appendImage(img);

          // 5.4. Redimensionnement des photos trop grandes
          width = photo.getWidth();
          height = photo.getHeight();
          ratio = width / height;
          if (photo.getWidth() > 250){
            photo.setWidth(250);
            photo.setHeight(parseInt(250/ratio));
          }
          for (let i = 0; i < parseInt(tReponse[4]) - 1; i ++){ 
            tr.appendTableCell("");
          }

          // 5.5. Ajout du style (centrer horizontalement la photo dans la cellule)
          styles[DocumentApp.Attribute.HORIZONTAL_ALIGNMENT] = DocumentApp.HorizontalAlignment.CENTER;
          photo.getParent().setAttributes(styles);

          // 5.6. Incrémentation de la variable "nbPhotosDocs"
          nbPhotosDocs ++;
        });
      });

      // 6. Sauvegarde de l'exécution
      fSauvegarde.appendRow([Utilities.formatDate(new Date(),"GMT+2","dd/MM/yyyy"),mailUtilisateur,tReponse[3],tReponse[2],tReponse[4],nbPhotosDocs,document.getUrl()]);

      // 7. Affichage du lien du fichier
      htmlOutput = HtmlService.createHtmlOutput('<p>Lien vers le fichier généré : <a href="' + document.getUrl() + '" target="_blank">Lien</a></p>')
        .setWidth(300)
        .setHeight(80);
      SpreadsheetApp.getUi().showModalDialog(htmlOutput, 'Tableau généré');


      document.saveAndClose();

It's work perfectly but the problem is that I can't get the index of my tr to apply the above code.

const table = body.getTables()[0]; // Please set the index of the table.
  const index = Docs.Documents.get(documentId).body.content[body.getChildIndex(table) + 1].startIndex;
  const requests = [{
    updateTableRowStyle: {
      tableRowStyle: { preventOverflow: true },
      tableStartLocation: { index },
      fields: "preventOverflow",
    }
  }];
  Docs.Documents.batchUpdate({ requests }, documentId);

Solution

  • I believe your goal is as follows.

    • You want to use my answer to your showing script.
    • When I saw your showing script, it seemed that the script was incomplete because of no variables of fSauvegarde, tReponse, nbPhotosDocs, files, mailUtilisateur, styles. But, you say It's work perfectly. So, I believe that your actual script worked fine.

    In this case, how about the following modification? Before you use this script, please enable Google Docs API at Advanced Google services.

    From:

    });
    
    // 6. Sauvegarde de l'exécution
    fSauvegarde.appendRow([Utilities.formatDate(new Date(),"GMT+2","dd/MM/yyyy"),mailUtilisateur,tReponse[3],tReponse[2],tReponse[4],nbPhotosDocs,document.getUrl()]);
    

    To:

    });
    
    document = setPreventOverflow(document); // Added
    
    // 6. Sauvegarde de l'exécution
    fSauvegarde.appendRow([Utilities.formatDate(new Date(),"GMT+2","dd/MM/yyyy"),mailUtilisateur,tReponse[3],tReponse[2],tReponse[4],nbPhotosDocs,document.getUrl()]);
    

    And, please add the following function.

    function setPreventOverflow(doc) {
      const documentId = doc.getId();
      doc.saveAndClose();
      doc = DocumentApp.openById(documentId);
      const body = doc.getBody();
      const tables = body.getTables();
      const obj = Docs.Documents.get(documentId).body.content;
      const requests = tables.map(table => ({
        updateTableRowStyle: {
          tableRowStyle: { preventOverflow: true },
          tableStartLocation: { index: obj[body.getChildIndex(table) + 1].startIndex },
          fields: "preventOverflow",
        }
      }));
      Docs.Documents.batchUpdate({ requests }, documentId);
      return doc;
    }
    

    Note:

    • When your actual script works fine and this modification is reflected in the script, the check of "Allow row to overflow across pages" of each table of the created document is unchecked.

    Reference: