 |
<html>
<head>
<title>Ajax Sample Page</title>
<script type="text/javascript">
<!--
var objXmlHttp;
function butDispAddress_OnClick() {
// XMLHttpRequest の準備
objXmlHttp = createXmlHttpObj();
if (objXmlHttp == null) {
window.alert("XMLHttpRequest オブジェクトが利用できません");
return;
}
objXmlHttp.onreadystatechange = objXmlHttp_OnReadyStateChange;
// REST リクエスト
objXmlHttp.open("GET", "/AddressWebService/Service.asmx/GetAddressByPostalCode?strPostalCode="
+ document.getElementById("txtPostalCode").value);
objXmlHttp.send();
}
// レスポンス取得時
function objXmlHttp_OnReadyStateChange() {
if (objXmlHttp.readyState == 4) {
if (objXmlHttp.status == 200) {
var strData;
if (objXmlHttp.responseXML.documentElement) {
strData = objXmlHttp.responseXML.getElementsByTagName("string")[0].childNodes[0].nodeValue;
if (strData == null) {
window.alert("データ取得エラー");
}
} else {
window.alert("データ取得エラー");
}
document.getElementById("txtAddress").value = strData;
}
else {
window.alert("通信エラー Status:" + objXmlHttp.status);
}
}
}
// Webブラウザによる XMLHttp オブジェクト差異の吸収
function createXmlHttpObj() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
else if (window.ActiveXObject) {
try {
return new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e) {
try {
return new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e) {
return null;
}
}
}
else {
return null;
}
}
// -->
</script>
<noscript>
JavaScriptが利用可能な環境でご利用下さい。<br />
</noscript>
</head>
<body>
郵便番号:<input id="txtPostalCode" type="text" size="7" maxlength="7" />
<input id="butDispAddress" type="button" value="住所取得" onclick="butDispAddress_OnClick()" />
7桁ハイフンなしで入力<br />
住所 :<input id="txtAddress" type="text" size="50" maxlength="50" />
住所取得ボタンクリックで自動入力<br />
</body>
</html>
|
|