• Resolved mjunes

    (@mjunes)


    Hello,

    I’m using the print button from this plugin. And when I click the button, in the print window the form is appearing fine but it does not have the form template that I have selected in the form (calculated fields form). It is appearing with default template. How to fix this?

    Thank you.

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author codepeople

    (@codepeople)

    Hello @mjunes,

    Please, indicate the URL to the webpage where the form is inserted to check the issue in detail.

    Best regards.

    Thread Starter mjunes

    (@mjunes)

    Hello Codepeople,

    I have found out the issue. I had given the wrong id in the print fucntion. I have another problem now. I have implemented canvas.js charts to display the values in a chart format. Now when I click the cp blocks print button, everything appears in the print window except for the chart. However, if I right click on the page and click print, the chart is included in the print window. any idea how to fix this?

    Please find the url in this paste bin. https://pastebin.com/8tLpbXid

    PS: Please type in some value say 2000 in the daily calories field and select a preset to see the chart.

    Thank you

    Plugin Author codepeople

    (@codepeople)

    Hello @mjunes,

    Please, replace the content of the “HTML Content” field, that includes the definition of the printForm function, with the following piece of code:

    
    <script>
    window['printForm']=function(selector){function _cloneCanvas(newCanvas,oldCanvas){var context=newCanvas.getContext('2d');newCanvas.width=oldCanvas.width;newCanvas.height=oldCanvas.height;context.drawImage(oldCanvas,0,0);};function _getStyles(){var r='';$(document).find('link[type*="css"],style').each(function(){r+=this.outerHTML;});return r;};function _callPrint(w){if(w&&w["printMe"]) w["printMe"]();else setTimeout(function(){_callPrint(w);},50);};try{if(typeof jQuery!='undefined'){if(typeof selector!='undefined'){var $=jQuery,f=$(selector),c,e,h,t,w,d;if(f.length){c=f.clone();c.find('script').remove();c.find('input').each(function(){e=$(this);if(typeof e.prop('checked')!='undefined') e.attr('CHECKED',e.prop('checked'));e.attr('value',e.val());});h=c[0].outerHTML;c.find('TEXTAREA').each(function(){e=$(this);t=e.parent().html();h=h.replace(t,e.val());});c.find('SELECT').each(function(){e=$(this);t=e.parent().html();h=h.replace(t,f.find('#'+e.attr('id')+' option:selected').text());});w=window.open('about:blank','Print','scrollbars=yes');d=w.document;focus();d.open();d.write('<body>'+_getStyles()+h+'</body>'+'<oscriptc>function printMe(){focus();print();close();};<o/scriptc>'.replace(/<o/g,'<').replace(/c>/g,'>'));setTimeout(function(){$(d).find('canvas').each(function(i,e){_cloneCanvas(e,f.find('canvas:eq('+i+')')[0]);});d.close();_callPrint(w);},1000);}else{throw"Form's selector is incorrect";}}else{throw'Requires the selector';}}else{throw'Requires the jQuery framework';}}catch(err){if(typeof console!='undefined') console.log(err);}};
    </script>
    

    and that’s all.
    Best regards.

    Thread Starter mjunes

    (@mjunes)

    Thank you very much. That did the trick. Top notch support. Will rate 5 stars. Just curious, is it possible to force the print window to save it as pdf?

    Plugin Author codepeople

    (@codepeople)

    Hello @mjunes,

    It depends of your operating system, for example, Windows 10 allows you select a PDF generator as the printer to use, and in this case the output would be a pdf file.

    Best regards.

    Thread Starter mjunes

    (@mjunes)

    Hello again,

    I just noticed that this issue is still happening in android device Chrome browser. The print preview screen shows the form but without the styling and chart. Please find the url in the paste bin below.

    https://pastebin.com/8tLpbXid

    Plugin Author codepeople

    (@codepeople)

    Hello @mjunes,

    I’ve responded to your other ticket, sending you a replacement for the printForm code. Concerning to the styles of printed form, ensure you have ticked the checkbox in the printer dialog to include the background graphics:

    Best regards.

    Thread Starter mjunes

    (@mjunes)

    Hello Codepeople,

    Thank you very much.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Print Button Ignores the Form Styling’ is closed to new replies.