(Update at end)
I'm working on an idea using unfamiliar technology. I've written a few WCF services, but I've never done any advanced configuration. This is my first dive into jQuery. The premise is I create a WCF service to get branch information, to be retrieved by jQuery.
My first search yielded this page: http://www.codeproject.com/KB/aspnet/WCF_JQUERY_ASMX.aspx#2 which I'm using as the base of my code. I initially started off as a cross-site setup, which I got rid of to see if I could just get the thing working. I've searched stack overflow and none of the posts resolve my 400 Bad Request issue.
Code from my web.config:
<system.serviceModel> <behaviors> <serviceBehaviors> <behavior name="GeoDataBehavior"> <serviceMetadata httpGetEnabled="true" /> <serviceDebug includeExceptionDetailInFaults="true" /> </behavior> <behavior name=""> <serviceMetadata httpGetEnabled="true" /> </behavior> </serviceBehaviors> <endpointBehaviors> <behavior name="GDEPBehavior"> <webHttp /> </behavior> </endpointBehaviors> </behaviors> <bindings> <webHttpBinding> <binding name="GDBinding" crossDomainScriptAccessEnabled="true"/> </webHttpBinding> </bindings> <services> <service behaviorConfiguration="GeoDataBehavior" name="GeoDataService"> <endpoint address="" binding="webHttpBinding" contract="IGeoDataService" behaviorConfiguration="GDEPBehavior"/> <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange"/> </service> </services> Code from my interface:
[ServiceContract] public interface IGeoDataService { [OperationContract] [WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Wrapped, ResponseFormat = WebMessageFormat.Json)] List<BranchData> GetBranches(); } // Use a data contract as illustrated in the sample below to add composite types to service operations. [DataContract] public class BranchData { [DataMember] public string BranchNumber { get; set; } [DataMember] public string BranchName { get; set; } [DataMember] public string StreetAddress { get; set; } [DataMember] public string City { get; set; } [DataMember] public string Zip { get; set; } [DataMember] public string State { get; set; } [DataMember] public string Phone { get; set; } [DataMember] public string County { get; set; } } jQuery script:
<script type="text/javascript" language="javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.6.1.js"> </script> <script type="text/javascript" language="javascript"> /* help from http://www.codeproject.com/KB/aspnet/WCF_JQUERY_ASMX.aspx */ var varType; var varUrl; var varData; var varContentType; var varDataType; var varProcessData; function CallService() { // Thank you Bing: http://blueonionsoftware.com/blog.aspx?p=03aff202-4198-4606-b9d6-686fd13697ee jQuery.support.cors = true; $.ajax({ type: varType, url: varUrl, data: null, crossDomain: true, contentType: varContentType, dataType: varDataType, processdata: varProcessData, success: function (msg) { ServiceSucceeded(msg); }, error: ServiceFailed }); /* $.getJSON(varUrl, null, function (msg) { ServiceSucceeded(msg); }); */ } function GetBranchDataJson() { varType = "POST"; varUrl = "GeoDataService.svc/GetBranches"; varData = ""; varContentType = "application/json; charset=utf-8"; varDataType = "json"; varProcessData = true; CallService(); } function ServiceSucceeded(result) { var ddlResult = document.getElementById("ddlResult"); for (var j = ddlResult.options.length - 1; j >= 0; j--) { ddlResult.remove(j); } for (var i = 0; i < result.length; i++) { var opt = document.createElement("option"); opt.text = result[i].BranchName; ddlResult.options.add(opt); } } function ServiceFailed(jqXHR, errorType, errorThrown) { alert('error!\n' + jqXHR + '\n' + errorType + '\n' + errorThrown); } </script> <input name="WTF" type="button" onclick="GetBranchDataJson()" /> You'll note I'm using jQuery 1.6.1, not 1.3 from the tutorial. The tutorial runs fine on my box and does everything as expected. Unfortunately, my code does not. I appreciate any help y'all can provide.
Oh, and here's a copy of the request from Fiddler:
POST http://localhost:16062/GeoDataService.svc/GetBranches HTTP/1.1 Accept: application/json, text/javascript, */*; q=0.01 Content-Type: application/json; charset=utf-8 Referer: http://localhost:16062/Default.aspx Accept-Language: en-us Accept-Encoding: gzip, deflate User-Agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0) Host: localhost:16062 Content-Length: 0 Connection: Keep-Alive Pragma: no-cache Update: Ok, I passed "{}" as the Data query (apparently this is the right way to pass nothing to a method that does not take parameters), and I now get Unsupported Media Type. And the trace exception is: System.ServiceModel.ProtocolException: Content Type application/json; charset=utf-8 was sent to a service expecting text/xml; charset=utf-8.