topical media & game development

talk show tell print

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">&nbsp;&nbsp;
  <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.