wicked_pdf: Is it possible to have the header only

2019-02-15 14:36发布

Right now I have :header => {:html => {:template => "layouts/pdf_header.html.erb"}} setting things up. Is there something I can pass in that will only show the header on the first page of the document?

Can I do this for the footer as well? It's almost more important here, because I can't really think of any other way to get a footer to dynamically stick to the bottom of the page when it's going to be different lengths and different numbers of pages every time.

2条回答
\"骚年 ilove
2楼-- · 2019-02-15 15:02

Add layout when rendering pdf

format.pdf do
  render :pdf => "my_pdf",
  :layout => 'pdf
end

views/layouts/pdf.haml

%html
  %head

  %body
    = render "layouts/header"
    = yield
    = render "layouts/footer"
查看更多
混吃等死
3楼-- · 2019-02-15 15:16

Some quick javascript can take care of this. Follow the boilerplate laid out under 'Footers And Headers' on wkhtmltopdf

These are your header and footer templates respectively. The key variable to keep track of is 'page' which is available from URL hash. Your header will look something like this:

<div class="headerContent" style="display:none">
   ...my awesome html
    <hr />
</div>
<script type="text/javascript">
    var headerCheck = function() {
      var x=document.location.search.substring(1).split('&');
      for (var i in x) {
        if(x[i] == "page=1")
          document.getElementsByClassName("headerContent")[0].style.display = "block";
       }
     }();
</script>

Similarly for your footer the code will look something like this:

<div class="footerContent" style="display: none">
    ...awesome footer html
</div>
<script type="text/javascript">
    var footerCheck = function() {
       var x=document.location.search.substring(1).split('&');
       var currentPage = 1;
       for (var i in x) {
         var z=x[i].split('=',2);
         if(z[0] == "page")
           currentPage = unescape(z[1]);
         if(z[0] == "topage" && currentPage == unescape(z[1]))
           document.getElementsByClassName("footerContent")[0].style.display = "block";
        }
     }();
 </script>
查看更多
登录 后发表回答