jsreport forum

Adrian Floor

Thank you @bjrmatos for your assistance

Adrian Floor

Thank you very much for the assistance @bjrmatos ,

I imported the changes to my server, and I also updated the playground, however I am getting a "504 Gateway Time-out" error. When I examine the error on the API side I get the following:

Page error: RangeError: Maximum call stack size exceeded

at checkJqueryHasLoadedThenUse (http://localhost:5488/assets/content/helper-functions.js:65:37)

at checkJqueryHasLoadedThenUse (http://localhost:5488/assets/content/helper-functions.js:73:20)

Adrian Floor

Hello @bjrmatos I have uploaded the code to playground:

https://playground.jsreport.net/w/adrian.floor/5eeUtvf0

I will appreciate your assistance

Adrian Floor

We are currently exploring the use of jquery on some of our report templates to modify how certain fields in the report are displayed.

Using the handlebars engine and the chrome-pdf recipe.

We have a handlebars template where we input the report parameters and use this template to execute javascript to then render other report detail template files, which are also handlebars templates.

This is the javascript that we call from the report parameters template file, in order to render the report detail template files:

Firstly to render as HTML in browser

jsreport.renderAsync({
        template: {
          name: report,
          recipe: 'html',
        },
        data: {
          params
        }
      }).then((r) => $('#render-target').html(r.toString()))

Secondly to download as PDF

jsreport.download(`${report}-${commonParams.etFrom}-${commonParams.etTo}.pdf`, {
        template: {
          name: report
        },
        data: {
          params
        }
      })

In our report parameters template file we have a link reference to JQuery as follows:

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

However, if we use JQuery in the report detail templates that get rendered, the report detail renders perfectly for the html rendering in the browser, but for the PDF download, JQuery does not resolve, we get this error from within the JSReport nodejs code running in the JSReport docker container.

We then tried to include the link reference to JQuery in the report detail templates as well, but this caused JQuery to load a second time, breaking the report parameters use of jquery.

Lastly, we tried including conditionally including JQuery scripts based on whether we are doing an HTML or PDF render.

if(isPdfDownload) {
        loadJavascriptToHeader("https://code.jquery.com/jquery-2.2.4.min.js");
    }

We then delayed the printing to PDF by setting waitForJS setting to true on the API side, as well as including the code snippet below on the template to allow the javascript to finish running, and also put our code behind a function that checks if JQuery has loaded yet:

setTimeout(function() {
        window.JSREPORT_READY_TO_START = true; //this will start the pdf printing
    }, 500);

    function checkJqueryHasLoadedThenUse() {
        if(typeof jQuery == 'function') {
            //... our report specific code here
            return;
        } 
        else {
            timeout(checkJqueryHasLoadedThenUse(), 10)
        }
    }
    
    checkJqueryHasLoadedThenUse();

However, we got the errors in JSReport nodejs docker container again, saying that JQuery could not be resolved.

Would appreciate if anyone could give some ideas on how to troubleshoot or how to do this differently?

Posts made by Adrian Floor