Page break within a table component

[mpsbhat]

Namaste,

I'm checking some conditions to have a pagebreak within a table after a particular row count. Below is a sample code for the reference.

        var dd = {
                  content: [
                      {
                          table: {
                              dontBreakRows: true,
                              headerRows: 0,
                              body: [
                                  ['row Header', 'column B'],
                                  ['row 1', 'column B'],
                                  ['row 2', 'column B'],
                                  ['row 3', 'column B'],
                                  [{text: '', pageBreak: 'after'}, ''],
                                  ['row 4', 'column B'],
                                  ['row 5', 'column B']
                              ]
                          }
                      },
                  ]
              }

In the above sample when i comment headerRows: 1, in table definition then it breaks the table to next page as expected. But when headerRows: 1, is enabled then there is an extra blank page appends soon after breaking the table to next page. Any possibilities to handle this case to avoid the extra blank page?

[AlliedComputing]

Having the same problem here. Any update on this?

[olafur-palsson]

@mpsbhat Page with tables are pretty tricky in this library and don't break rows has uncovered edge cases. I've personally not had a lot of success with dontBreakRows and instead use a workaround to get stable page splitting based on whether content fits on page. Not sure if this helps though.

Other notes on quirks:

• Empty strings "" don't get rendered but single space does " ".
• pageBreak: 'before' will break before the unrendered text node instead of before the table row.

What's could be happening is that the second column is getting rendered, then page-break, then the left column but since it's "bigger than one page" it renders a whole extra page.

Try putting spaces in and another header row after the page break and see if it works for you.

        var dd = {
                  content: [
                      {
                          table: {
                              dontBreakRows: true,
                              headerRows: 0,
                              body: [
                                  ['row Header', 'column B'],
                                  ['row 1', 'column B'],
                                  ['row 2', 'column B'],
                                  ['row 3', 'column B'],
                                  [{text: ' ', pageBreak: 'after'}, ' '],
                                  ['row Header', 'column B'],
                                  ['row 4', 'column B'],
                                  ['row 5', 'column B']
                              ]
                          }
                      },
                  ]
              }

Here's my workaround for reference.

#1159 (comment)

[mpsbhat]

@olafur-palsson Namaste,

As mentioned in my comment itself, the code works even if there is no space in the case of headerRows: 0 but it adds an extra page for headerRows: 1

Screenshots attached for reference.