Question

I am working with a user control that has set of javascript functions that are called when an action is performed. This user control is used in a lot of places in the application.

When one of the inbuilt JS function completes execution, I need to fire a custom JS function on my page.

Is there a way for me to attach a function to be fired when another function completes execution? I don’t want to update the inbuilt JS function to call this page JS function.

Hope this makes sense.

Answer 1

There are a couple design patterns you could use for this depending upon the specific code (which you have not shared) and what you can and cannot change:

Option 1: Add a callback to some existing code:

function mainFunction(callbackWhenDone) {
    // do other stuff here
    callbackWhenDone();
}

So, you can call this with:

mainFunction(myFunction);

Option 2: Wrap previous function:

obj.oldMethod = obj.mainFunction;
obj.mainFunction = function() {
    this.oldMethod.apply(this, arguments);
    // call your stuff here after executing the old method
    myFunction();
}

So, now anytime someone does:

obj.mainFunction();

it will call the original method and then call your function.