1

The goal is to have just the div with id="yourdiv" instead of the whole page. It works in Windows OS with Chrome but it does not work in iPad with Chrome which is my end goal.

The Script

function printContent(el){
var restorepage = $('body').html();
var printcontent = $('#' + el).clone();
$('body').empty().html(printcontent);
window.print();
$('body').html(restorepage);

The Button after some basic page example html

<div>
<p>whatever don't print this</p>
</div>
<div id="yourdiv">
<p>print this only</p>
</div>
<button id="print" onclick="printContent('yourdiv');" >Print</button>
speshock
  • 130
  • 1
  • 11
  • Why not write a printer only css? Put everything on display none except the element you want to be printed. No need for javascript – caramba Dec 17 '19 at 20:40
  • 1
    I can't say with 100% certainty, but I think it could be a result of differing engines across platforms. This link has a little more information on the differences: https://stackoverflow.com/a/50461106/2720343 (Tl;Dr Chrome on iOS has a different tech stack from its desktop counterparts, and that can lead to compatibility issues) – Dortimer Dec 17 '19 at 20:40
  • Thanks for the info link @Dortimer For the printer only css option its not something I can do in this case sadly. Great suggestion caramba and print controls via css is always my go to so this is new for me in cross platform systems. – speshock Dec 17 '19 at 20:49

1 Answers1

1

Found a solution with another post that works in iPad with Chrome browser.

Print <div id="printarea"></div> only?

The solution from Hardik Thaker is the one that works for this. Though if you dont know you'll have to look up how to add in css to have it pull page styling.

speshock
  • 130
  • 1
  • 11
  • You should accept this answer so others know you have your solution :) – iPhoenix Dec 17 '19 at 22:16
  • @iPhoenix Would love to but system restrictions wont allow me to accept the answer till tomorrow. Good looking out for the community. – speshock Dec 17 '19 at 22:36