Ajax Events

Posted on Author admin

These are the events that are raised whenever a ajax request is made.

These events are divided into – Local Events and Global Events

Local Events :

These Events are listened or subscribed within the ajax request.

  • beforeSend
  • complete

Example :

<script>
$.ajax({
beforeSend: function () {
//executes before send
},

complete: function () {
//complete event
}
})
</script>

Global Events

These events are triggered on document. These can be listened like

<script>
$(document).ajaxSuccess(function () {
//It will execute when Ajax request completes successfully
</script>

List of Ajax Events – in the order they are triggered

  • ajaxStart (Global Event)
    • beforeSend (Local Event)
    • ajaxSend (Global Event)
    • success (Local Event)
    • ajaxSuccess (Global Event)
    • error (Local Event)
    • ajaxError (Global Event)
    • complete (Local Event)
    • ajaxComplete (Global Event)
  • ajaxStop (Global Event)

Explanation

  1. beforeSend : It is fired before Ajax request runs. Thereby you can modify request object.
  2. ajaxSend : It also fire before Ajax request runs, It is a global event
  3. success : It is called on successful completion of the request
  4. ajaxSuccess :also called when the request is successfully completed. It is a Global event
  5. error :Called when error occurred in the request.
  6. ajaxError :Works same as local event ‘error’
  7. complete :It is fired when the request finishes execution. It is fired no matter the request has been a success or not.
  8. ajaxComplete :Works same as local event ‘complete’

Note :

Global Events can be disabled for a particular ajax request. Like this
$.ajax({
global:false
})