Error during JSON request

I have a JSON request that check to the server if a username has been already taken during the registration procedure.

This is the jQuery call:

// Instant check availability of the username
$("#txtUserName").blur(function() {
    if ($("#txtUserName").val() == "") return;
    $.ajax({
        type: 'post',
        url: '/Login/CheckUserName',
        data: "{userName: '" + $("#txtUserName").val() + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(message) {
            //Set the spanChecking tex开发者_运维技巧t letting user know if the uname is available
            if (message.d == true) {
                $("#userNameCheck").css({ "color": "red", "font-weight": "bold", "font-size": "small", "padding-left": "5px" });
                $("#userNameCheck").text("Non disponibile");
            }
            else {
                $("#userNameCheck").css({ "color": "green", "font-weight": "bold", "font-size": "small", "padding-left": "5px" });
                $("#userNameCheck").text("Disponibile");
            }
        },
        error: function(errormessage) {
            //this is just to see if everything is working. Remove before deploy
            $j("#userNameCheck").text(errormessage.responseText);
        }
    });
});

and this is the controller action that will serve the request

[HttpPost]
public JsonResult CheckUserName( string userName ) {
    if ( Membership.GetUser( userName ) == null )
        return Json(false);
    else
        return Json(true);
}

Anyway I dont understand why I am getting error 500 from the server. Looking at it with Fiddler I can see that the RAW request is

POST http://localhost:1037/Login/CheckUserName HTTP/1.1
Host: localhost:1037
Connection: keep-alive
Referer: http://localhost:1037/Login/Register
Content-Length: 22
Origin: http://localhost:1037
X-Requested-With: XMLHttpRequest
Content-Type: application/json; charset=UTF-8
Accept: application/json, text/javascript, */*
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/534.3 (KHTML, like Gecko) Chrome/6.0.472.63 Safari/534.3
Accept-Encoding: gzip,deflate,sdch
Accept-Language: it-IT,it;q=0.8,en-US;q=0.6,en;q=0.4
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3

{userName: 'sampleuser'}

but the controller Action receive a null parameter for userName. I see this through Fiddler and even putting a breakpoint on the code.

Where am I doing wrong?

EDIT

The error returned back to the client is

The value cannot be null. Parameter name: username

Please note that the parameter Name in the error is not preserving the original case. Is this a behaviour of the membership provider or should I lower the case of the parameter?

This:

{userName: 'sampleuser'}

...is not valid JSON. This is, and might be what you want:

{"userName": "sampleuser"}

See the RFC for the details of the JSON format.

Try using this format for the data parameter in your call instead:

data: "userName=" + $("#txtUserName").val()

You are sending the request as JSON but there's nothing in the server that understands or expects this format. You have a controller action which expects application/x-www-form-urlencoded content type. Try this instead:

data: { userName: $('#txtUserName').val() },
contentType: 'application/x-www-form-urlencoded',

This also has the advantage to take care of properly url encoding the parameters sent to the server which in your version using string concatenations wasn't achieved.

Have you checked the routing, and specifically the capitalisation?

Post your route for this call, maybe there's something there?