3
votes

I am trying to print a planning calendar but I have a problem in CSS as interval time.

onPrint:function(){ 
  var $domTarget = this.byId("PC1").$()[0],
  sTargetContent = $domTarget.innerHTML,
  sOriginalContent = document.body.innerHTML;
  document.body.innerHTML = sTargetContent;
  window.print();
  document.body.innerHTML = sOriginalContent;
}

Print View: enter image description here

Normal View: enter image description here

1

1 Answers

1
votes

Browsers remove certain CSS attributes by default when printing. The most common one is background settings but there might be others. There's a print setting to restore it.

If that doesn't work, have a look at the @media=print option that can add styles to prints specifically. I do not know if UI5 excludes certain things from their stylesheets for certain media. You could, for instance, replace the background settings with an image or something. This might force the right height/width and background colours.

I'm not saying this will solve your problems entirely, but compare these two images:

enter image description here

enter image description here

Edit: it might just work:

enter image description here