Print table to multi-page pdf

5 posts, 0 answers
  1. Paul
    Paul avatar
    9 posts
    Member since:
    Feb 2014

    Posted 20 Jul 2015 Link to this post

    I'm printing a table containing an unknown number of rows to pdf - the output is printing to multiple pages automatically. However, the width of the columns on each page varies and I would like to overcome this, if possible.

    Ideally, I would be able to repeat the header row on each page using a template, but I suspect this wouldn't affect the cell widths of subsequent rows.

    I don't want to fix the cell widths on the table when the page is rendered, but I have tried to fix the width of all the cells using javascript immediately before printing. This had no affect, however.

    What is the best way to deal with this?

  2. Mihai
    Admin
    Mihai avatar
    153 posts

    Posted 21 Jul 2015 Link to this post

    Hi Paul,

    Unfortunately, this isn't doable at the moment.  The way automatic page breaking works is by physically splitting a copy of the DOM nodes, so for example:

        <table>
          <tr>...</tr>
          <tr>...</tr>
          ...
        </table>

    becomes:

        <!-- page 1 -->
        <table>
          <tr>..</tr>
          ...
        </table>
        
        <!-- page 2 -->
        <table>
          <tr>..</tr>
          ...
        </table>

    When the width of each cell is determined by content, then obviously they will not match from a page to another.  The only thing I can recommend for now is to assign fixed widths to <td> elements.

    Also, repeating the header is not supported.  Please feel free to post a feature request for this at our User Voice Forum.

    Regards,
    Mihai
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Paul
    Paul avatar
    9 posts
    Member since:
    Feb 2014

    Posted 21 Jul 2015 in reply to Mihai Link to this post

    Thanks for your reply Mihai,

    I tried fixing the width of all <td> elements immediately before printing, using javascript and inline styles, but this had no effect. Is this the right approach, or do the widths have to be assigned via a stylesheet/class?

    Paul

  5. Mihai
    Admin
    Mihai avatar
    153 posts

    Posted 21 Jul 2015 Link to this post

    Hi Paul,

    That should work, I don't think doing it via classes/stylesheets is going to do any better.  Can you please post an example on http://dojo.telerik.com/ so I can investigate?

    Regards,
    Mihai
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Paul
    Paul avatar
    9 posts
    Member since:
    Feb 2014

    Posted 22 Jul 2015 in reply to Mihai Link to this post

    Hi Mihai,

    I realised that the class assigned to the cell had a max-width property to keep the cells narrow. When I assign both 'width' and 'min-width' inline styles to the cells, it works a lot better. For some reason it isn't perfect - there is still some small variation in width - but it's much better.

    Thanks for your help.

    Paul

     

Back to Top
Kendo UI is VS 2017 Ready