SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Hybrid View

  1. #1
    SitePoint Evangelist ashattuc's Avatar
    Join Date
    Aug 2002
    Location
    Boise, Idaho
    Posts
    411
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How do I dynamically joad javascript for an AJAX application?

    Hello there,

    I've found some examples on the web on how to load an external javascript file dynamically, but I'm running into some problems. Here's what I want to do:
    1. The user clicks on a particular element which loads an external javascript file dynamically. The javascript contains a function.
    2. Then, the onclick attribute calls the function that was loaded.
    The problem I'm having is that I can get the javascript to load, but when the function is called, it doesn't exist yet. If I click on the element again, it does. However, I need it to work the first time.

    My goal is to be able to dynamically load javascript for my AJAX application, so I don't have to load everything right away, so it's more of an "as-needed" thing.

    Has anyone succesfully accomplished this?

    Thanks!
    Chris
    Chris S.

    Free Web Scripts - Form generators, AJAX tools and more!
    Micro CMS - A totally free AJAX-based, SEO-ed CMS!

  2. #2
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You could do a try catch on calling the method, and if it fails, call the onclick method again (replicating the second click).

    If not that, then let us see what you have in place at the moment, and we may be able to help.


  3. #3
    SitePoint Evangelist ashattuc's Avatar
    Join Date
    Aug 2002
    Location
    Boise, Idaho
    Posts
    411
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you for your response, Gav, it looks like that might be the only solution available.

    Thanks,
    Chris
    Chris S.

    Free Web Scripts - Form generators, AJAX tools and more!
    Micro CMS - A totally free AJAX-based, SEO-ed CMS!

  4. #4
    SitePoint Wizard cranial-bore's Avatar
    Join Date
    Jan 2002
    Location
    Australia
    Posts
    2,634
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    One approach could be to set a flag on the click that the newly downloaded JS will react to once it's available.

    1. the user clicks your element
    2. The new JS file is downloaded / added to the DOM
    3. A flag is set, some var that the new JS will check for
    4. Once loaded, the new JS can find that flag and do whatever it was meant to.

    Another approach is simply to combine, compress and cache your JS files so you don't need to lazy load like this. Reducing the number of HTTP requests and compressing with gzip or similar will probably speed your app as much as lazy loading the new JS files.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •