Page reload after print contents

Question

I am using div to print (window.print()) for printing contents. But after print function the side menu of the current page is not working (not supporting). Because of this issue I am using location.reload(); for page reload. but that also not working. Please help me.

My div to print function is,

 function printDiv(divName) {
    $("#DataTables_Table_0_length").hide();
    $("#DataTables_Table_0_filter").hide();
    $("#DataTables_Table_0_info").hide();
    $("#DataTables_Table_0_paginate").hide();
    var printContents = document.getElementById(divName).innerHTML;
    var originalContents = document.body.innerHTML;
    document.body.innerHTML = printContents;
    window.print();
    document.body.innerHTML = originalContents;
    $("#DataTables_Table_0_length").show();
    $("#DataTables_Table_0_filter").show();
    $("#DataTables_Table_0_info").show();
    $("#DataTables_Table_0_paginate").show();
    window.location.reload(true);
}

Answer 1

You can wrap your print logic inside if block and use another window for your printing content:

if(window.print){
        var printWindow = window.open('', 'Printing...', 'height=400,width=600');
        printWindow.document.write(YOUR_CONTENT_OF_DIV);
        printWindow.document.close(); 
        printWindow.focus();
        printWindow.print();
        printWindow.close();
} else {
        alert("Printing is not supported by browser")
}

Answer 2

If you're using some theme, probably the side menu is being hide using the CSS media query "@media print". Just use the debugger or even your IDE to find the occurrences. Btw, you should also create a CSS rule for print your div instead of using JS, by simply:

@media print {
  .your-div #DataTables_Table_0_length {
    display: none;
  }
  // ...
}