How to print in html without the URL and date but still have the title on top?

Question

This is the form where you'll see the schedules of a specific subject with details:

This is the form where you'll see the schedules of a specific subject with details

This is what happen when I click the print button:

This is what happen when I click the print button

This is the button to print.

<button onclick="print('to-print')">Print</button>

This is what will be print.

<div id="to-print"> 
<table> 
  <thead>
     <th>Teacher In-charge</th>
     <th>Time</th>
     <th>Section</th>
     <th>Room</th>
   </thead>
   <tbody>
      <tr>
        <td>John Doe</<td>
        <td>M-W-F / 7:00 - 8:00 am</td>
        <td>A</td> 
        <td>Room 1</td>
      </tr>
   </tbody>
</table>
</div>

The javascript functions.

<script> 
 function printdiv(printpage) {
   var headstr = "<html><head><title></title></head><body>";
   var footstr = "</body>";
   var newstr = document.all.item(printpage).innerHTML;
   var oldstr = document.body.innerHTML;
   document.body.innerHTML = headstr+newstr+footstr;
   window.print();
   document.body.innerHTML = oldstr;
   return false;
 } 
</script>

I already used this kind of method in my css but then it will also remove the Title

<style> 
 @page { size: auto;  margin: 0mm; }
</style>

Whether URL and date are printed is a browser setting, you can not change that using HTML/CSS/JavaScript. — CBroe, Aug 28 '17 at 12:02
By *"The title"* you mean is that date and *CSIT Subject Landing* text? I'm afraid you can't remove then in your page, only in browser's print settings. — DontVoteMeDown, Aug 28 '17 at 12:03
It;s tricky - see https://stackoverflow.com/questions/1960939/disabling-browser-print-options-headers-footers-margins-from-page — Stuart, Aug 28 '17 at 12:05
alternatively you can use Javascript to convert your html to PDF, and print from PDF. ( I don't have any experience with that, I mainly use PHP for that kind of stuff ) — aahhaa, Aug 28 '17 at 12:47
I've just decided to switch for the alternative way by using the @page directive and just putting the title on top. XD — Mark Dhem, Aug 28 '17 at 13:53

score 0 · Answer 1 · answered Jun 11 '20 at 20:34

I use this code

@media print {
    @page 
    {
        size: auto;   /* auto is the initial value */
        margin: 0mm;  /* this affects the margin in the printer settings */
    }

    body 
    {
        background-color:#FFFFFF; 
        border: solid 1px black ;
        margin: 0px;  /* this affects the margin on the content before sending to printer */
   }
}

workin for me

hope help you

How to print in html without the URL and date but still have the title on top?

1 Answers1