title: Consuming Wcf Service using JavaScript
body: <p>I have created a WCF Service. It is working fine. When I am consuming it using Java Script, it can not find the Service.</p>
  
  <p>My Java Script Code:</p>
  
  <pre><code>&lt;head&gt;
  &lt;title&gt;&lt;/title&gt;
  &lt;script src="Scripts/jquery-2.1.1.js"&gt;&lt;/script&gt;
  &lt;script src="Scripts/MicrosoftAjax.js"&gt;&lt;/script&gt;
  &lt;script src="Service/DataService.svc/js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      $(function () {
          $("#BtnSendMessage").click(
          function () {
              CallXmlDataService();
          });
      });
  
      function CallXmlDataService() {        
  
          var Data_Service = new IDataService();
          var UserName = document.getElementById("TxtName").value;
          var UserEmail = document.getElementById("TxtEmail").value;
          var UserMessage = document.getElementById("TxtMessage").value;
          Data_Service.InsertData(UserName, UserEmail, UserMessage);
          alert("Data Inserted Successfully");
      }
  &lt;/script&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p>My Service Contract:</p>
  
  <pre><code>[ServiceContract]
  public interface IDataService
  {
      [OperationContract]
      void InsertData(string Name, string Email, string Message);
  }
  </code></pre>
  
  <p>All files are created in the same solution. Check it out:</p>
  
  <p><img src="https://i.stack.imgur.com/k2c4F.jpg" alt="enter image description here"></p>
  
  <p>My HTML Page:</p>
  
  <pre><code>&lt;body&gt;
  &lt;table id="TblExport"&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="text" id="TxtName" /&gt;&lt;/td&gt;
          &lt;td&gt;&lt;input type="text" id="TxtEmail" /&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td colspan="2"&gt;
              &lt;textarea id="TxtMessage"&gt;&lt;/textarea&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="button" id="BtnSendMessage" value="SendMessage" /&gt;&lt;/td&gt;
          &lt;td&gt;&lt;label id="LblErrorMessage"&gt;&lt;/label&gt;&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>When i click on the Send Message button, the console says IDataService is not defined.</p>
  
  <p><img src="https://i.stack.imgur.com/I4h4Q.jpg" alt="enter image description here"></p>
  
  <p>My Web Config file:</p>
  
  <pre><code>&lt;configuration&gt;
  &lt;system.web&gt;
  &lt;compilation debug="true" targetFramework="4.5.1" /&gt;
  &lt;httpRuntime targetFramework="4.5.1" /&gt;
  &lt;/system.web&gt;
  &lt;system.serviceModel&gt;
  &lt;behaviors&gt;
    &lt;endpointBehaviors&gt;
      &lt;behavior name="XmlDataApplication.Service.XmlDataApplicationBehavior"&gt;
        &lt;enableWebScript/&gt;
      &lt;/behavior&gt;
    &lt;/endpointBehaviors&gt;
    &lt;serviceBehaviors&gt;
      &lt;behavior name=""&gt;
        &lt;serviceMetadata httpGetEnabled="true" httpsGetEnabled="true" /&gt;
        &lt;serviceDebug includeExceptionDetailInFaults="false" /&gt;
      &lt;/behavior&gt;
    &lt;/serviceBehaviors&gt;
  &lt;/behaviors&gt;
  &lt;serviceHostingEnvironment aspNetCompatibilityEnabled="true"
    multipleSiteBindingsEnabled="true" /&gt;
  &lt;services&gt;
    &lt;service name="XmlDataApplication.Service.DataService"&gt;
      &lt;endpoint address="" behaviorConfiguration="XmlDataApplication.Service.XmlDataApplicationBehavior" binding="webHttpBinding" contract="XmlDataApplication.Service.IDataService"&gt;&lt;/endpoint&gt;
    &lt;/service&gt;
  &lt;/services&gt;
  </code></pre>
  
  <p>
  </p>