XMLHttpRequest post 400 Bad request error when calling wcf Service

Question

Hi I'm posting to a wcf service from javascript. I can post a single parameter (string, blob, int) fine, but when I try to put the data in a class I get a 400 Bad Request error. I've tried both Bare and Wrapped for my BodyStyle, but get the same error for each. Any ideas what could be happening?

Thanks

Pete

C# Data Contract:

 [DataContract]
    public class TestData
    {
       [DataMember]
        public string SubmissionID { get; set; }

    }

C# Interface:

 [OperationContract(Name = "Upload")]
        [DataContractFormat]
        [WebInvoke(Method = "POST",
                   UriTemplate = "Upload/",
                   BodyStyle = WebMessageBodyStyle.Wrapped,//Bare gives same error
                   ResponseFormat = WebMessageFormat.Json)]
        String Upload(TestData ps);

C# Service Method:

 public String Upload(TestData ps)
        {
....
return "Submission Complete";
}

Javascript call:

var TestData = {SubmissionID: "1" };
 var xhr = new XMLHttpRequest();
                xhr.open('POST', 'http://localhost:59070/WCFUploader.svc/Upload/', true);
xhr.send(TestData);//400 Bad Request

C# Web Config:

 <?xml version="1.0"?>
    <configuration>

      <appSettings>
        <add key="aspnet:UseTaskFriendlySynchronizationContext" value="true" />
      </appSettings>
      <system.web>
        <compilation debug="true" targetFramework="4.6.1" />
        <httpRuntime targetFramework="4.6.1"/>
      </system.web>
      <system.serviceModel>
          <services>
              <service name="PhotoUploadServiceTest.WCFUploader" behaviorConfiguration="defaultServiceBehavior">
                  <endpoint address="" binding="webHttpBinding" behaviorConfiguration="defaultEndpointBehavior"

                     contract="PhotoUploadServiceTest.IWCFUploader" />
              </service>
          </services>
          <bindings>
              <webHttpBinding>
                  <binding maxBufferSize="2147483647"

                           maxBufferPoolSize="2147483647"

                           maxReceivedMessageSize="2147483647"

                           transferMode="Streamed"

                           sendTimeout="00:05:00">
                      <readerQuotas  maxDepth="2147483647"

                                     maxStringContentLength="2147483647"

                                     maxArrayLength="2147483647"

                                     maxBytesPerRead="2147483647"

                                     maxNameTableCharCount="2147483647"/>
                      <security mode="None" />
                  </binding>
              </webHttpBinding>
          </bindings>
          <behaviors>
              <endpointBehaviors>
                  <behavior name="defaultEndpointBehavior">
                      <webHttp/>
                  </behavior>
              </endpointBehaviors>
              <serviceBehaviors>
                  <behavior name="defaultServiceBehavior">
                      <serviceMetadata httpGetEnabled="true" />
                      <serviceDebug includeExceptionDetailInFaults="true" />
                  </behavior>
              </serviceBehaviors>
          </behaviors>

        <protocolMapping>
            <add binding="basicHttpsBinding" scheme="https" />
        </protocolMapping>    
        <serviceHostingEnvironment aspNetCompatibilityEnabled="true" multipleSiteBindingsEnabled="true" />
      </system.serviceModel>

      <system.webServer>
        <modules runAllManagedModulesForAllRequests="true"/>
        <!--
            To browse web app root directory during debugging, set the value below to true.
            Set to false before deployment to avoid disclosing web app folder information.
          -->
        <directoryBrowse enabled="true"/>
      </system.webServer>

    </configuration>

Answer 1

The problem was in my javascript call. I needed to set the content of the request header to "application/json" and needed to create a String serial of the object before I sent it -- used dojo.toJson from the dojo library:

   var TestData = {SubmissionID: "1" };
   xhr.setRequestHeader("Content-type", "application/json");
   var xhr = new XMLHttpRequest();
            xhr.open('POST', 
   'http://localhost:59070/WCFUploader.svc/Upload/', true);
  xhr.send(dojo.toJson(TestData));//this worked!!