javascript - Print datatable - new page -


i'm trying print datatable using javascript , css this:

<h:commandbutton value="#{portal.btnprint}" type="submit" onclick="javascript: window.print();"/>  <p:datatable id="tbl" var="item" value="#{myprins.model}" ... ... </p:datatable>  @media print {   table { font-size: 80%; }   #menu, #header, #form, #form_error { display: none; }    @page { size: a4 landscape !important; }   ....   .... } 

and, if understand weel, it's dom based printing, prints, set printed , visible on screen.

problem is, can't handle end of pages: enter image description here

what i've tried , refused:

  • styling row heigth or font size (problem happens again on next pages)
  • print table per pages (1st page - print, 2nd page - print atc.). user-enemy big datatable
  • print header on each page using @media print { thead {display: table-header-group;} } - works in firefox only
  • export xls (i can't reason)
  • page-break-inside: avoid; doesn't work in chrome

how print whole datatable @ once , automatically split pages correct?

emergency solution:

  • mozilla firefox
  • css: @media print { tr { page-break-inside: avoid !important; } }

new issues & advantages:

  • header automatically on each page
  • border of table shifted bit left , top (from 2nd page)
  • => had make top , left border of table bit thicker enough visible on next pages:

    css: @media print { table { border-top: 3px solid #acbece; .. } }


Comments

Popular posts from this blog

Android : Making Listview full screen -

javascript - Parse JSON from the body of the POST -

javascript - Chrome Extension: Interacting with iframe embedded within popup -