topical media & game development
basic-xml-20-PhoneBookClient.htm / htm
<html>
<head>
<title>PhoneBook Web Client</title>
<script type="text/javascript">
var SERVICE_URL = "http://localhost/phonebook/phonelookup.asmx";
var PARSER_ID = "Msxml2.DomDocument.4.0";
var REQUESTER_ID = "Msxml2.XmlHttp.4.0"
//var PARSER_ID = "Msxml2.DomDocument.3.0";
//var REQUESTER_ID = "Msxml2.XmlHttp.3.0"
function doSoapRequest(Surname)
{
var sTemplateXml = '<soap:Envelope '
+ 'xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" '
+ 'xmlns:xsd="http://www.w3.org/2001/XMLSchema" '
+ 'xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">'
+ '<soap:Body>'
+ '<FindNumbers xmlns="http://wrox.com/PhoneBook/PhoneLookup">'
+ '<Surname/></FindNumbers></soap:Body></soap:Envelope>';
var oDom = new ActiveXObject(PARSER_ID);
oDom.setProperty("SelectionLanguage", "XPath");
var oHttpReq = new ActiveXObject(REQUESTER_ID);
var bLoaded = oDom.loadXML(sTemplateXml);
if (bLoaded)
{
var sNamespaces = "xmlns:soap='http://schemas.xmlsoap.org/soap/envelope/' "
+ "xmlns:myNS='http://wrox.com/PhoneBook/PhoneLookup'";
oDom.setProperty("SelectionNamespaces", sNamespaces);
var sXPath = "/soap:Envelope/soap:Body/myNS:FindNumbers/myNS:Surname";
var oParameterNode = oDom.selectSingleNode(sXPath);
oParameterNode.text = Surname + "%";
oHttpReq.open("POST", SERVICE_URL, false);
var sActionHeader = "http://wrox.com/PhoneBook/PhoneLookup/FindNumbers";
oHttpReq.setRequestHeader("SOAPAction", sActionHeader);
oHttpReq.send(oDom);
showMessage("request", oDom.xml);
if (oHttpReq.status == 200)
{
if (oHttpReq.responseXML)
{
showMessage("response", oHttpReq.responseXML.xml);
oDom.load(oHttpReq.responseXML);
showResult(oDom);
}
else
{
showMessage("response", oHttpReq.getAllResponseHeaders() + "\n"
+ oHttpReq.responseText);
}
}
else
{
showMessage("response", oHttpReq.status + " - " + oHttpReq.statusText);
}
}
else
{
showMessage("response", oDom.parseError.reason + "\n"
+ oDom.parseError.srcText);
}
oHttpReq = null;
oDom = null;
}
function showMessage(Type, Text)
{
var sId = (Type.toLowerCase() == "request" ? "txtRequest" : "txtResponse");
var oText = document.getElementById(sId);
oText.value = Text;
}
function parseResult(Text)
{
var arrDetails = Text.split("|");
return arrDetails[0] + ", " + arrDetails[1] + " - " + arrDetails[2] + "<br>";
}
function showResult(Dom)
{
var oDiv = document.getElementById("divNumbers");
var sXPath = "/soap:Envelope/soap:Body/myNS:FindNumbersResponse/"
+ "myNS:FindNumbersResult/myNS:string";
var colNodes = Dom.selectNodes(sXPath);
var iResultCount = colNodes.length;
var sResult = "";
if (iResultCount > 0)
{
for (var i = 0; i < iResultCount; i++)
{
var oResultNode = colNodes[i];
sResult += parseResult(oResultNode.text);
}
}
else
{
sResult = "No numbers found.";
}
oDiv.innerHTML = sResult;
}
function init()
{
document.getElementById("txtSurname").focus();
}
</script>
</head>
<body onload="init();">
<input type="text" id="txtSurname" size="20" maxlength="20">
<input type="button" value="Send Request" onclick="doSoapRequest(txtSurname.value);"><br>
<div id="divNumbers" style="position: relative;border: 3px outset #c0c0c0; height: 150px; width: 80%;"></div>
<table cols="2" width="100%">
<tbody>
<tr><th>Request</th><th>Response</th></tr>
<tr><td><textarea id="txtRequest" cols="50" rows="25"></textarea></td>
<td><textarea id="txtResponse" cols="50" rows="25"></textarea></td></tr>
</tbody>
</table>
</body>
</html>
(C) Æliens
20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.