Capture and handling the tab/Textchanged event in a textbox in asp.net MVC

Question

I have the following code th handle a user name validation on the server side. But the event seems not firing since break points in js or C# code didn't hit. Can anyone point out where I did wrong?

Here is the user control which has a user name textbox:

<%: Html.TextBox("UserName", Model.Username, new { maxlength = "40", size = "20", tabindex = "1", @onchange = "CheckAvailability()" })%>

CheckAvailability() is defined in the User.Validation.js and included in the above user control: $(document).ready(function () {

function CheckAvailability() {
    $.post("/Home/Survey/CheckAvailability",
{ Username: $("#UserName").val() },
    function (data) {
        var myObject = eval('(' + data + ')');
        var newid = myObject;
        if (newid == 0) {
            $("#usernamelookupresult").html("<font color='green'>Available :-D</font>")
        }
        else {
            $("#usernamelookupresult").html("<font color='red'>Taken :-(</font>")
        }
    });
}

});

Here is the survey controller function which will have server side validation:

    [HttpPost]
    public ActionResult CheckAvailability(string Username)
    {
        int Taken = 0;
        //  This is where you add your database lookup
        if (Username == "abc")
        {
            Taken = 1;
        }
        return Json(Taken);
    }