title: Unable to consume WCF service with javascript (readyState goes from 1 to 4)
body: <p>Whenever I try to consume the WCF using the javascript below in an external file, the readyState goes from 1 to 4. The ResponsText is always empty in every case.</p>
  
  <p>Whenever I try to consume the WCF using the same code, but this time in the project itself, it's working as it is supposed to.</p>
  
  <p>What am I doing wrong? Thanks in advance.</p>
  
  <p>I have an interface </p>
  
  <pre><code>namespace CeviService
  {
       [ServiceContract(Namespace = "CeviService")]
      public interface ICeviSpotter
      {
  
           [WebInvoke(ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]
            String EchoWithPost(string n1, string n2);
    }
  
  }
  </code></pre>
  
  <p>with an implementation </p>
  
  <pre><code>namespace CeviService
  {
  public class CeviSpotter : ICeviSpotter
  {
       public String EchoWithPost(String n1, String n2)
      {
          return n1;
      }
  }}
  </code></pre>
  
  <p>using the following web.config</p>
  
  <pre><code>&lt;?xml version="1.0"?&gt;
  &lt;configuration&gt;
      &lt;system.serviceModel&gt;
          &lt;behaviors&gt;
              &lt;serviceBehaviors&gt;
                  &lt;behavior name="MyServiceTypeBehaviors"&gt;
                      &lt;serviceMetadata httpGetEnabled="true"/&gt;
                  &lt;/behavior&gt;
              &lt;/serviceBehaviors&gt;
              &lt;endpointBehaviors&gt;
                  &lt;behavior name="AjaxBehavior"&gt;
                      &lt;webHttp/&gt;
                  &lt;/behavior&gt;
              &lt;/endpointBehaviors&gt;
          &lt;/behaviors&gt;
      &lt;serviceHostingEnvironment multipleSiteBindingsEnabled="true" /&gt;
          &lt;services&gt;
              &lt;service name="CeviService.CeviSpotter" behaviorConfiguration="MyServiceTypeBehaviors"&gt;
                  &lt;endpoint contract="IMetadataExchange" binding="mexHttpBinding" address="mex"/&gt;
                  &lt;endpoint address="ajaxEndpoint" behaviorConfiguration="AjaxBehavior" binding="webHttpBinding" contract="CeviService.ICeviSpotter"/&gt;
              &lt;/service&gt;
          &lt;/services&gt;
      &lt;/system.serviceModel&gt;
      &lt;system.web&gt;
          &lt;compilation debug="true"/&gt;&lt;/system.web&gt;
    &lt;system.webServer&gt;
      &lt;modules runAllManagedModulesForAllRequests="true"/&gt;
    &lt;/system.webServer&gt;
  &lt;/configuration&gt;
  </code></pre>
  
  <p>that is called using the following javascript:</p>
  
  <pre><code> function makeCall(operation) {
  
          // Create HTTP request
          var xmlHttp;
          try {
              xmlHttp = new XMLHttpRequest();
          } catch (e) {
              try {
                  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
              } catch (e) {
                  try {
                      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                  } catch (e) {
                      alert("This sample only works in browsers with AJAX support");
                      return false;
                  }
              }
          }
  
          // Create result handler
          xmlHttp.onreadystatechange = function () {
              alert(xmlHttp.readyState);
                //  alert(xmlHttp.responseText);
  
          }
  
          // Build the operation URL
          var url = "http://localhost:49456/CeviSpotter.svc/ajaxendpoint/EchoWithPost";
          //url = url + operation;
  
          // Build the body of the JSON message
          var val1 = document.getElementById("num1").value;
          var val2 = document.getElementById("num2").value;
  
  
          var body = '{"n1":';
          body = body + val1 + ',"n2":';
          body = body + val2 + '}';
  
          // Send the HTTP request
          xmlHttp.open("POST", url, true);
          xmlHttp.setRequestHeader("Content-type", "application/json");
          xmlHttp.send(body);
  
      }
  </code></pre>
  
  <p>and the host being configured as follows:</p>
  
  <pre><code>&lt;%@ServiceHost 
      language="C#"
      Debug="true"
      Service="CeviService.CeviSpotter"
  %&gt;
  </code></pre>