strange js onclick problem

Hi folks

i am calling two js functions in onclick event as follows

onclick="add_emp();refresh();"

Code (markup):

now both above functions are ajax functions. first one passes an employee no to ad the new employee. 2nd reload the employee list php file.
now problem is, the second refresh() function is not executing. if i just ad an alert('test') in to the refresh() ajax function code
then it works. so whats the problem really.

function refresh(){
	
	[B]alert('hai');[/B] //if i put this, then the second function is executed.
	
	var xmlhttp;
	
	if (window.XMLHttpRequest){
	  // code for IE7+, Firefox, Chrome, Opera, Safari
	  xmlhttp=new XMLHttpRequest();
	}else{
	  // code for IE6, IE5
	  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

Code (markup):

 

The "refresh()" function IS executing both times, whether you put the "alert('test')" or not, but the problem is your "refresh()" function is executing before your "add_emp()" can finish. JQuery runs asynchronously. So your "refresh()" function actually loads the same old content, not the updated stuff.

When you add the "alert()" function in your "refresh()" function, its gives the "add_emp()" function time to complete, or rather it brings the "refresh()" function to a halt until you click "ok"/"close"/"whatever the button says".

If you replace the "alert('hai');" function with something like

doNothing(){}
var t = setTimeout("doNothing()", 2000);

Code (markup):

It may work MOST times, if not all times, without a silly alert popup.


But that's still not the right way of running an ajax callback. You gotta post your "add_emp()" function code for us to show you how to properly run the function after the ajax call.

But try the above and tell me how that works.

 

Hai Andre9,

Thanks for your valuable reply. yes now i undestand the issue

 

why don't you execute the other function after the first function is executed?

something like this..

function func1(callback){

...

if(callback) callback();

}

function func2(){

...

}

<button onclick="func1(func2)">Click </button>

Code (markup):

 

Thanks JohnnySchultz,

Another very valuable reply, both methods given in this thread works for me folks!!!

 

You're welcome!