Hello Everyone,

The issue: I have created a page that loads two other pages into div’s at the press of a button, and then removes them on another press

Both these pages contain JavaScript. On one of the pages, the JavaScript fires when the page is loaded to fill out values pulled from a database.

The pages are loaded using a simple Ajax call, that puts the contents in the div.

The problem: obviously loading pages this way means I can’t use ‘document.load’ to fire the JavaScript. I’m also finding that none of the scripts are loaded either.

I have a solution that can load the JavaScript after completion of the document.load, but for some reason it’s not detecting the global variables with the initial Json data in it.

Both pages work individually.

The question:

  1. How do I get this to work?
  2. Is there a better (preferably non-iframe) way of doing this?
  3. Why, when the JavaScript is loaded manually, is it seeing the global Json values as ‘not yet defined’?

Happy to offer any other information needed.

Thanks in advance

  • Black Xanthus@lemmy.worldOP
    link
    fedilink
    arrow-up
    2
    ·
    1 year ago

    That works except for the pages loaded in, which do have the JavaScript tags at the end of their respective pages, however, one claims that the variables being set at the top of the script are not accessible

    • 🧟‍♂️ Cadaver
      link
      fedilink
      arrow-up
      4
      ·
      1 year ago

      Without seeing any code it seems obscure… Did you properly close the script tag ?

      Can you host your code somewhere ? Codepen maybe ?