Remove header and footer when I click print button using Codeigniter

Question

Footer:

<script>  
 $('#print').click(function(){
      var printElm = $('.print-this');
      if(printElm.length == 0) {
        alert("Nothing to print!"); return;
      }
      printElm.printThis({
        header:'<h3 style="text-align:center;">Printing Elements<h3>'
      });
    });
</script>

View:

<div class="container print-this">
 <table class="table table-hover" style="border:3px solid 
   black;font-family:Roboto;font-size:15px">
     <tr style="border-bottom:hidden">
        <td colspan="5" style="font-weight:bold">School_name</td>
        <td align="right" style="font-weight:bold">Roll NO</td>
      </tr>
</table>
</div>

Normally print button is display in footer when I click that button it execute the print function in footer in that situation I need to hide the header and footer in print page.How can I do this??Can You please help me to complete the task.

Answer 1

Footer:

<style>
  @media print {
  #header, #footer { display: none; }
}
</style>

Just assign the id for header and footer and put the above code in footer and when you click print button, it hides the header and footer of the page.