i am using ajax using the $.post method my code is

<script type="text/javascript">
$(document).ready(function() {

$("#addbutton").click(function(){
$.post('task-usingdollarpost.php', {
taskname: $("#taskname").val()
taskname: $("#taskname").val(),
taskname: $("#taskname").val()
},
function(response){
$("#loading").hide();
$("#done").fadeIn(1000).text(response);
}
);
return false;

});

});

</script>

html code

<form>
<input type="text" name="taskname" id="taskname" size="20" />
<input type="button" name="addbutton" id="addbutton" value="Add" />
</form>


my question is using this $.post method i am able to specify the url, variables that i am passing to a php file and a function that will be called when ajax is complete however what i need is function when the ajax is being processed so that i can show a loading image and error if an error occurs

for loading i have used this code
$("#addbutton").ajaxStart(function(){
$("#loading").css("display","block");
});

immediately after $(document).ready(function() {

});

and for error i have used this code after the ajaxStart function

$("#addbutton").ajaxError(function(){
$("#error").css("display","block");
});

is this the right way to show the loading div which has the loading image while the ajax request is being processed when using $.post

also the ajaxError is not working properly for example if i were to rename the php file in the server that i have mentioned in $.post or if i have a syntax error in the php file then the ajaxError function should be executed however i am getting a browser error message and the error div is not being displayed which i have created to show when an error occurs with $("#error").css("display","block");

how to fix the ajaxError function

hey, why can't you use $.ajax instead of $.post and u can use blockUI plugin for your "processing text".

For $.ajax
http://api.jquery.com/jQuery.ajax/

For blockUI (go for the demos and have a try on it)
http://jquery.malsup.com/block/

One sample shall be like,

$("#addbutton").click(function(){  

$.blockUI({ message: '<h1><img src="busy.gif" /> Just a moment...</h1>' });

$.ajax({
   type: "POST",
   url: "some.php",
   data: "name=John&location=Boston",
   
   complete: function(){
     $.unblockUI();
   }
   success: function(msg){
     
      alert( "Data Saved: " + msg );
   }
   error:function(XmlHttpRequest,statusText,errorThrown){
     // handle errors here
   } 
 });

 });