How to convert PrimeFaces p: dataTable to standard h: dataTable (without skin) and then print

I want to print <p:dataTable> , so I use <p:printer> , but I want to skip printing the skin and make it look like <h:dataTable> . How can i do this?

Also, is it possible to change the orientation of the recording paper? I would like to print it as a landscape instead of a portrait.

 <h:outputLink id="lnk" value="#"> <p:printer target="tbl" /> <p:graphicImage value="http://www.primefaces.org/showcase/images/print.png" /> </h:outputLink> 

I did not find a suitable attribute in the <p:printer> .


Update : sorry, it doesn't matter that <p:printer> can be used in <h:dataTable> , so you can also just answer the second question.

+7
source share
1 answer

In both answers, the CSS @media print rule responds. It allows you to specify CSS styles specific to print output. You can embed these rules in a regular CSS stylesheet or in a <style> element in the usual way.


I want to print <p:dataTable> , so I use <p:printer> , but I want to skip printing the skin and make it look like <h:dataTable> . How can i do this?

Find the class name <p:dataTable> and redefine it in the @media :

  @media print { .primeFaces-dataTable-className { border: 0; margin: 0; padding: 0; background: none; color: black; } } 

Most likely, I don’t know all this from the very beginning, you should check with the development tools Firebug or Chrome which class name was used and what properties were set, so that you know that you should reset to 0 , none or another value by by default.


Also, is it possible to change the orientation of the recording paper? I would like to print it as a landscape instead of a portrait. Use CSS.

According to CSS 2.1, you can specify it as follows:

 @media print { @page { size: landscape; } } 

This, however, prevents browser specifics; it is not supported in FF and MSIE <= 7. For workarounds, check the accepted answer to this question: Landscape printing from HTML

+7
source

All Articles