0

this is my very first question on Stackoverflow. I am currently developing a print function in my sap ui5 app to print out certain UI controls. I've got the function from here: http://embed.plnkr.co/jjyEPa1updkjBiNZqumS/preview However, during runtime, when I click on the print button, my app only jumps to the method once and executes it correctly (to print). But after that, I can press the printbutton as often as I want, nothing happens and I can't find out why.

what the method does: i replace the body with a temporary body, which only contains the elements to be printed and execute window.print(). afterwards i insert the original body content again. Of course I use the UI controls to grab the HTML tags.

 onPrintChart: function(oEvent){
   var oTarget = this.getView(),
             sTargetId = oEvent.getSource().data("targetId");
            
        if (sTargetId) {
            oTarget = oTarget.byId(sTargetId);
        }
        
        if (oTarget) {
            var $domTarget = oTarget.$()[0],
                sTargetContent = $domTarget.innerHTML,
              sOriginalContent = $(document.body)[0].innerHTML;
                
            $(document.body)[0].innerHTML = sTargetContent;
            
           window.print();

            $(document.body)[0].innerHTML = sOriginalContent;
         }  else {
            jQuery.sap.log.error("onPrint needs a valid target container [view|data:targetId=\"SID\"]");
        }
        
  }
J K
  • 1
  • Works fine for me. Everytime i clicked the button, the print dialog opened. – alexP Jun 04 '20 at 10:34
  • i guess you mean the link, because that's where it works for me too. but when i put it into my app it only works once. – J K Jun 04 '20 at 10:37
  • Any errors in console? – alexP Jun 04 '20 at 10:39
  • unfortunately there are no Erros either. even when debugging I didn't notice anything. I must also say that I'm still a beginner. – J K Jun 04 '20 at 11:11
  • @JK For second click there might be some error in console could you please check again :) – KcH Jun 04 '20 at 11:51
  • the only thing the console shows are "Verbose Logs" (after I close the print dialog but before I press the print button for the second time): [Violation] 'click' handler took 5831ms [Violation] Forced reflow while executing JavaScript took 106ms [Violation] Forced reflow while executing JavaScript took 48ms so this happens with the first click. with the 2nd click absolutely no (new) log types are shown :/ – J K Jun 04 '20 at 22:43

1 Answers1

0

I managed to do it in a different, more elegant way without using a temporary body. I used CSS to hide all irrelevant elements (display: none) and keep only the relevant element for printing.

Apparently ui5 hung up when replacing the original body temporarily with another body. I noticed that ALL buttons didn't work anymore, not only the print button.

J K
  • 1
  • That's not ui5... Dom elements loose all Eventhändler If body is replaced. – Benedikt Kromer Jun 05 '20 at 23:30
  • Thanks man! This information is very useful. I just tried not to replace the whole body but a child element which contains the whole page, and it actually worked. the event handlers still work fine. I just wonder why this problem does not appear in the link I posted above. – J K Jun 07 '20 at 00:54