Can I run a JavaScript function AFTER Google Loader has run?

Question

I am loading Google API using google.load() and I need to process some of what is built by it, but I need to run the JavaScript after it has already completely loaded, is there a way to ensure that happens?

Here is how I build the list of images, I need to add an attribute to each img tag though, can't do that until after it is built right?

google.load("feeds", "1");

function initialize() {
    var feed = new google.feeds.Feed("myfeed.rss");

    feed.load(function(result) {
        if (!result.error) {             

            var container = document.getElementById("feed");

            for (var i = 0; i < result.feed.entries.length; i++) {               

               var entry = result.feed.entries[i];

               var entryTitle = entry.title;
               var entryContent = entry.content;

               imgContent = entryContent + "<p>"+entryTitle+"</p>";

               var div = document.createElement("div");
               div.className = "image";               

               div.innerHTML = imgContent;

               container.appendChild(div);
           }
       }
   });
}

google.setOnLoadCallback(initialize);

score 2 · Answer 1 · edited Jan 01 '11 at 02:45

2

Yes, the API documentation specifies that you can include a callback function in the third parameter of the google.load() method.

Something like this should work:

google.load("jquery", "1.4.2", {
    callback: function() {
        alert('Finished!');
    }
});

edited Jan 01 '11 at 02:45

Yi Jiang

49,435
16
136
136

answered Jan 01 '11 at 02:10

Jesse Bunch

6,651
4
36
59

I think that is just a callback for once it has finished loading though. I had tried that and the function does not operate on the resulting list that is created. – thatryan Jan 01 '11 at 02:17
I thought you were wanting a callback once the loader finished loading something? Perhaps posting some of what you have right now will help me understand what you're needing... – Jesse Bunch Jan 01 '11 at 02:19
I added code to the original post, hope it helps make more sense. Thanks! – thatryan Jan 01 '11 at 02:27
Great. Try removing google.setOnLoadCallback(initialize); Is your initialize event not being called? It looks like you have everything set up correctly... – Jesse Bunch Jan 01 '11 at 02:33
Remove that and keep my custom callback in there? I did and nothing happened at all. But the initialize runs yes, the list is built perfect as I would expect it to.. – thatryan Jan 01 '11 at 02:37

score 2 · Accepted Answer · edited May 23 '17 at 12:18

A simple way to do this is by creating an anonymous function in the setOnLoadCallbacklike so:

google.setOnLoadCallback(function(){

    //Run the Initialize Function
    initialize(function(){
         //Run anything else here like
         alert("My function can run here :)")  
    });
});

and then just modify your initialize function.

function initialize() { > function initialize(callback) { so that you no are passing in an anonymous function to the intialize.

and then within the feed.load(function(result) {}); you can just do callback() to activate your callback.

you say that anonymous function confuses you, Let me first show you a few ways to write a function

function hello(){}
hello = function(){}

The above are non-anonymous functions

Anonymous functions are functions that are not assigned to a variable, so the parser goes over the function and does not execute it

alert("Start")
function()
{
    alert("Middle")
}
alert("End");

Running the above will show Start and End in a dialog but Middle will never show as the function has not been executed.

Function the following:

( F )( P )

Where F is an anonymous function and P Is the param that should be in the scope, you can directly run anonymous functions without ever assigning to the function to a variable liek so:

alert("Start")
(
    function(Doc){
        alert("Middle");
    }
)(document)
alert("End")

So document gets passed into the anonymous function and becomes Doc in that scope, and Start, Middle and End all will get executed as your using a self executed anonymous function

Ok so I might have gone over the top with the explanation so ill just quickly show you how the original method works

http://en.wikipedia.org/wiki/Ajax_(programming)

Ajax is Asynchronously which means that when your calling a server such as google for some information, your javascript will continue to execute which means while your waiting for data your javscript has carried on executing..

This is why we devoted callbacks just like the initialize callback, which the google Javascript library executes when its got the data, when have create our own and were executing when we want to.

Thanks Robert, that worked great. Though I would like to understand why it works more if you don't mind :) The anonymous function part confuses me.. lol — thatryan, Jan 01 '11 at 03:21
Awesome man, thanks a ton. I have used them before, but did not know exactly what it was doing. Thanks :) — thatryan, Jan 01 '11 at 04:05

Can I run a JavaScript function AFTER Google Loader has run?

2 Answers2

Linked