Prototype-ajax-response
提供:Dev Guides
プロトタイプ-AJAX Response()メソッド
このAJAX _Ajax.Response_は、すべてのAjaxリクエストコールバックの最初の引数として渡されるオブジェクトです。
これは、ネイティブxmlHttpRequestオブジェクトのラッパーです。 responseJSONおよびheaderJSONプロパティを介してJSONのサポートを追加しながら、クロスブラウザーの問題を正規化します。
Ajax.Responseオブジェクトのプロパティ
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 またはヌル |
The XML body of the response if the content-type of the request is set to application/xml. null otherwise. |
responseJSON |
Object, Array またはヌル |
The JSON body of the response if the content-type of the request is set to application/json. null otherwise. |
headerJSON |
Object, Array またはヌル |
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. |
例
以下は、_status_および_responseText_プロパティの使用法を示す例です-
<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>
*ajax.cgi* のコンテンツは次のとおりです。
#!/usr/bin/perl
print "Content-type: text/html\n\n";
print "This content is returned by AJAX cgi ";
print "Current Time " . localtime;
出力
Ajax.Responseオブジェクトのメソッド
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. |
例
以下は、_getAllHeaders()_および_getResponseHeader(name)_メソッドの使用法を示す例です-
<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>