Jquery ajax help

[garethhall]

Hey guys,

 

I am just in the process on converting a system to use jquery instead of normal javascript. But i need to detect the readystate in the jquery. How do I do that?

 

Normal JS

function theNewFiles(){
  xhrNewFiles=GetXmlHttpObject()
  if(xhrNewFiles==null){
  	alert("Browser does not support HTTP Request");
  	return;
  }
  var qstr;
  qstr = "action=noNewFiles";
  qstr += "&sid="+Math.random();
  xhrNewFiles.onreadystatechange = theNewFilesR;
  xhrNewFiles.open("POST","ajax/overview.php",true);
  xhrNewFiles.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhrNewFiles.send(qstr);	
}
function theNewFilesR(){
  if(xhrNewFiles.readyState == 3){
  	document.getElementById('newFiles').innerHTML = '<img src="images/loaderWhiteBG.gif" width="105" height="12" />';
  }else if(xhrNewFiles.readyState==4 || xhrNewFiles.readyState=="complete"){ 
  	document.getElementById('newFiles').innerHTML = xhrNewFiles.responseText;
  }
}

 

Converted to jquery

$.post(
  'ajax/overview.php',
  {'action' : 'noNewFiles'},
  function(data, textStatus){
  	$('#newFiles').text(data);
  }
);  

[trq]

If you pass in a third argument to your success function it will be the XMLHttpRequest object.

[garethhall]

I have updated my code but obj is undefined

 

$.post(
  'ajax/overview.php',
  {'action' : 'noNewFiles'},
  function(data, textStatus, obj){
         console.log(obj);
  	$('#newFiles').text(data);
  }
);

 

[haku]

If I can make a suggestion, why don't you use $.ajax() instead of $.post(). It's easier to use, and you can specify a callback function:

 

$.ajax(
  url:'ajax/overview.php',
  data:{'action' : 'noNewFiles'},
  success:function(data, textStatus, obj){
         console.log(obj);
     $('#newFiles').text(data);
  }
);

[garethhall]

Hi,

 

I don't think using $.post is any harder to write than $.ajax. That said yes having a callback is useful. I fixed some typos in your code but obj is still undefined

 

 

$.ajax({
  url:'ajax/overview.php',
  type: 'POST',
  data:{'action' : 'noNewFiles'},
  success:function(data, textStatus, obj){
         console.log(obj);
     $('#newFiles').text(data);
  }
});

 

[trq]

If I can make a suggestion, why don't you use $.ajax() instead of $.post(). It's easier to use, and you can specify a callback function:

 

$.post provides exactly the same callback functionality.

[haku]

The point was, with the callback function you don't need to know the readystate. jQuery takes care of that in the background for you.