Footer of my pdf pages

  • Hi, i'm working on create invoice pdf with jsreport studio. I made a lot of things, but i need the last one: the footer of all pdf pages with information like invoice number, current page/pages, and a counter for every document in the pdf.
    How can i do this? How can i print these information always in the footer of the pages?

  • administrators

    hi! assuming that you have already the invoice number and document count in your data input you can try something like this using the phantom's footer property of template

  • mmmm ok but there is a problem. My job is to provide a template that converts an xml with one or more invoices in pdf using jsreport. So if my data is composed of more than one invoices, how can i bind the right page with the right document number? In the body template i use
    {{each invoices}}
         {{}} N_invoices
    {{/ Each}}
    I do not know if it is clear.

  • administrators

    i was a bit sure that your values were actually dynamic and not something static 😀.. in that case you can't use the header and footer feature of phantom-pdf recipe, because these kind of content is not rendered as part of your main template. header and footer are like tiny templates that are just rendered as standalone before and after a new page is being printed, without having access or context about other code evaluated in your main template (like your each iteration).

    because this limitation of headers and footers (and because you require that your content is printed based on some code evaluated) your best option is to try a similar approach like the one described here, it uses some magic numbers (values that will need to be adapted depending on your machine and by your best judgment) to get in javascript the total of pages rendered, you can use this value to do some calculations and place content at the bottom of each page, basically emulating a footer by using fixed position. you can assign and id in html to each of the container of your invoice elements, and then again with javascript your can select each of them an get the absolute position of them in your document and use that values for your calculations about the position of your footers.

    i know this is a bit hard to do it but it is only because the current limitations of phantomjs header and footers. hopefully you can make it work.

  • Well it is really hard to do. I'll try. Does this works with electron-pdf recipe?

  • administrators

    electron-pdf does not have support for headers and footers (a limitation of electron engine), but you can apply the same technique described previously

  • ok i'll try what you say previously. Thanks a lot

  • Bjrmatos i've tried to use the same javascript in my project and it works with phantom-pdf but it doesn't work with electron-pdf that is the recipe that i'm using. There is something to change in my code?

    EDIT: I don't know why but now it works.

  • administrators

    be aware that probably for electron recipe you would need to change some part of the script, specifically this part:

     // fix phantomjs incorect calculation of page margin
        // 31 again magical number
        waterMarkTop += i * 31

    i did not try it but maybe in electron this fix of margin is not needed when using electron, the rest of the code looks normal javascript so it should work normally, maybe you just need some of the magic numbers but that should do it.

  • I've done it right. Thanks a lot for help me.

Log in to reply

Looks like your connection to jsreport forum was lost, please wait while we try to reconnect.