Ajax call to web method not working with content type set to ` application/json; charset=utf-8`

Question

I am trying to pass an array to c# webmethod using jquery ajax.

The code below works fine with C# 4.0 but creates the following exception with c# 2.0. Anyone knows how to solve this?

javascript code

var myarray=new Array();
    $.ajax({
            type: "POST",
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            url: "ClientSideMethods.asmx/ArrayTest",
            data: { "values": JSON.stringify(myarray) }
        }
        ).complete(function (data) {
            alert('complete');
        });

c# code

[WebMethod(EnableSession = true)]
public void ArrayTest(List<string> values)
{
    ...
}

Exception(From firebug)

System.InvalidOperationException: Request format is invalid: application/json; charset=utf-8.
   at System.Web.Services.Protocols.HttpServerProtocol.ReadParameters()
   at System.Web.Services.Protocols.WebServiceHandler.CoreProcessRequest()

edit: If I remove contentType: "application/json; charset=utf-8", the post will work, but the values are not received as an array

Edit: when I change content type to contentType: "application/json the following error occurs

System.InvalidOperationException: AnywhereLogin Web Service method name is not valid.
   at System.Web.Services.Protocols.HttpServerProtocol.Initialize()
   at System.Web.Services.Protocols.ServerProtocol.SetContext(Type type, HttpContext context, HttpRequest request, HttpResponse response)
   at System.Web.Services.Protocols.ServerProtocolFactory.Create(Type type, HttpContext context, HttpRequest request, HttpResponse response, Boolean& abortProcessing)

Answer 1

There's nothing wrong with contentType you've set. It's correct:

 contentType: "application/json; charset=utf-8",

First of all make sure you've valid handler mappings in web.config as shown below:

Edit:

 <system.web>
  <httpHandlers>
    <remove verb="*" path="*.asmx"/>
    <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
    <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
    <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>
  </httpHandlers>
</system.web>

For more info, check out this link

Apart from that you must surround data being passed with single/double quotes like below:

 data: "{ 'values':" + JSON.stringify(myarray) + "}"

Or jQuery will automatically URL encode it. For more info check this URL

Answer 2

This type of problem may occures some time. ajax call using webmethod working fine from code, but error 500 is displayed when we host on IIS. but don't worry your problem will be resolved by adding following statments in web.config below of system.web :-

</system.web>
<system.webServer>
    <modules runAllManagedModulesForAllRequests="true">
      <remove name="ScriptModule" />
      <add name="ScriptModule" preCondition="managedHandler"     type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
    </modules>

    <handlers>
      <remove name="ScriptHandlerFactory"/>
      <add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
    </handlers>
  </system.webServer>