- Prototype Tutorial
- Prototype - Home
- Prototype - Short Overview
- Prototype - Useful Features
- Prototype - Utility Methods
- Prototype - Element Object
- Prototype - Number Processing
- Prototype - Strings Processing
- Prototype - Array Processing
- Prototype - Hash processing
- Prototype - Basic Object
- Prototype - Templating
- Prototype - Enumerating
- Prototype - Event Handling
- Prototype - Form Management
- Prototype - JSON Support
- Prototype - AJAX Support
- Prototype - Expressing Ranges
- Prototype - Periodical Execution
- Prototype Useful Resources
- Prototype - Quick Guide
- Prototype - Useful Resources
- Prototype - Discussion
Prototype - AJAX Response() Method
This AJAX Ajax.Response is the object passed as the first argument of all Ajax requests callbacks.
This is a wrapper around the native xmlHttpRequest object. It normalizes cross-browser issues while adding support for JSON via the responseJSON and headerJSON properties.
Properties of the Ajax.Response Object
Property | Type | Description |
---|---|---|
status | Number | The HTTP status code sent by the server. |
statusText | String | The HTTP status text sent by the server. |
readyState | Number | The request's current state. 0 corresponds to "Uninitialized", 1 to "Loading", 2 to "Loaded", 3 to "Interactive" and 4 to "Complete". |
responseText | String | The text body of the response. |
responseXML | document Object or null |
The XML body of the response if the content-type of the request is set to application/xml. null otherwise. |
responseJSON | Object, Array or null |
The JSON body of the response if the content-type of the request is set to application/json. null otherwise. |
headerJSON | Object, Array or null |
Auto-evaluated content of the X-JSON header if present. null otherwise. This is useful to transfer small amounts of data. |
request | Object | The request object itself (an instance of Ajax.Request or Ajax.Updater). |
transport | Object | The native xmlHttpRequest object itself. |
Example
Following is the example to show the usage of status and responseText properties −
<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, onFailure: failureFunc }); } function successFunc(response) { if (200 == response.status) { alert("Call is success"); } var container = $('notice'); var content = response.responseText; container.update(content); } function failureFunc(response) { alert("Call is failed" ); } </script> </head> <body> <p>Click submit button to see how current notice changes.</p> <br /> <div id = "notice">Current Notice</div> <br /> <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;
Output
Methods of the Ajax.Response Object
Method | Type | Description |
---|---|---|
getHeader(name) | String or null |
Returns the value of the requested header if present. null otherwise. |
getAllHeaders() | String or null |
Returns a string containing all headers separated by a line break. |
getResponseHeader(name) | String | Returns the value of the requested header if present. Throws an error otherwise. This is just a wrapper around the xmlHttpRequest object.s native method. Prefer it's shorter counterpart getHeader. |
getAllResponseHeaders() | String | Returns a string containing all headers separated by a line break. Throws an error otherwise. This is just a wrapper around the xmlHttpRequest object's native method. Prefer it.s shorter counterpart getAllHeaders. |
Example
Following is the example to show the usage of getAllHeaders() and getResponseHeader(name) methods −
<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 }); } function successFunc(response) { var content = response.getAllHeaders(); var container = $(header1); container.update(content); var content = response.getResponseHeader('Content-Type'); var container = $(header2); container.update(content); } </script> </head> <body> <p>Click submit button to see the result:</p> <br /> <div id = "header1">All Headers</div> <div id = "header2">Content Type</div> <br /> <br /> <input type = "button" value = "Submit" onclick = "SubmitRequest();"/> </body> </html>
Output
prototype_ajax_tutorial.htm
Advertisements