Copyright © tutorialspoint.com

Prototype AJAX Responders() Method

previous next


Advertisements

The AJAX Ajax.Responders let you register global listeners about every step of Prototype-based AJAX requests.

There are two Responders one is used to register listeners and another can be used to unregister a listener.

Syntax:

Ajax.Responders.register(responder);

Ajax.Responders.unregister(responder);

Return Value :

Unregister A Responder :

If you plan on unregistering a responder, be sure to define it first, then pass the reference to register, and finally, when the time comes, to unregister.

Example:

Following is the example which counts currently active AJAX requests by monitoring their onCreate and onComplete events.

Click submit button many times and then see the result:

<html>
<head>
<title>Prototype examples</title>
   <script type="text/javascript" 
   src="/javascript/prototype.js">
   </script>
<script>


function SubmitRequest()
{

  
  new Ajax.Request('/cgi-bin/ajax.cgi', {
  method: 'get',
  onSuccess: successFunc  });

  
}

Ajax.Responders.register({
     onCreate: function() {

      var count = Ajax.activeRequestCount++;
      var container = $('requests');
      container.update(count);
    },

    onComplete: function() {
      var count =  Ajax.activeRequestCount--;
      var container = $('requests');
      container.update(count);
    }
});


function successFunc(response){
    var container = $('notice');
    var content = response.responseText;
    container.update(content);
}


</script>
</head>

<body>

  <p>Click Submit button many times and see the result.</p>
  <br />
 
  <div id="notice">Current Notice</div>
  <br />
  <div id="requests">Current Requets</div>
  <br />
  <input type="button" value="Submit" onclick="SubmitRequest();"/>

</body>
</html>

Here is the content of ajax.cgi

#!/usr/bin/perl

print "Content-type: text/html\n\n";

print "This content is returned by AJAX cgi 
"; print "Current Time " . localtime;

To understand it in better way you can Try it yourself.


previous next