jQuery Ajax post is not running the Controller Action

Question

I have this jQuery-script:

var registrationModel = {
            SurName: document.getElementById("SurName").value,
            LastName: document.getElementById("LastName").value,
            Email: document.getElementById("Email").value,
            PhoneNumber: document.getElementById("PhoneNumber").value,
            Password: document.getElementById("Password").value,
            Name: document.getElementById("Name").value,
            Street: document.getElementById("Street").value,
            ZipCode: document.getElementById("ZipCode").value,
            City: document.getElementById("City").value,
            Country: document.getElementById("Country").value
        };

        $.ajax({
            url: '@Url.Action("SaveRegisterDetailsToDb")',
            type: "POST",
            data: JSON.stringify(registrationModel),
            contentType: "application/json"
        });

And I have this Controller Action (user and company is set globally on the Controller):

[HttpPost]
    public async Task<ActionResult> SaveRegisterDetailsToDb(RegisterViewModel model)
    {
        //Skapa ApplicationUser i db

        user.UserName = model.Email;
        user.Email = model.Email;
        user.PhoneNumber = model.PhoneNumber;
        user.SurName = model.SurName;
        user.LastName = model.LastName;

        company.CompanyIdentity = model.CompanyIdentity;
        company.Name = model.Name;
        company.Street = model.Street;
        company.ZipCode = Convert.ToInt32(model.ZipCode);
        company.City = model.City;
        company.Country = model.Country;

        user.WorkPlaceId = company.CompanyIdentity;

        var result = await UserManager.CreateAsync(user, model.Password);

        if (result.Succeeded)
        {
            await UserManager.AddToRoleAsync(user.Id, "Customer");

            //Spara Company mot db.
            var db = new IdentityDb();

            db.Companies.Add(company);
            db.SaveChanges();

        }
        else
        {
            AddErrors(result);
        }
        return View("Login");
    }

And this is my model:

  public class RegisterViewModel
{
    //Constructor
    public RegisterViewModel()
    {
        _companyIdentity = Guid.NewGuid().ToString();
    }

    [Display(Name = "Användarnamn")]
    public string UserName { get; set; }

    [Required]
    [Column("SurName")]
    [Display(Name = "Förnamn")]
    public string SurName { get; set; }

    [Required]
    [Column("LastName")]
    [Display(Name = "Efternamn")]
    public string LastName { get; set; }

    [Required]
    [DataType(DataType.EmailAddress)]
    [EmailAddress]
    [Display(Name = "Email")]
    public string Email { get; set; }

    [Required]
    [DataType(DataType.PhoneNumber)]
    [Phone]
    [Display(Name = "Telefonnummer")]
    public string PhoneNumber { get; set; }

    [Required]
    [StringLength(100, ErrorMessage = "{0} måste vara minst {2} tecken långt. Försök igen!", MinimumLength = 6)]
    [DataType(DataType.Password)]
    [Display(Name = "Lösenord")]
    public string Password { get; set; }

    [DataType(DataType.Password)]
    [Display(Name = "Upprepa Lösenord")]
    [System.ComponentModel.DataAnnotations.Compare("Password", ErrorMessage = "Lösenorden stämmer inte. Försök igen!")]
    public string ConfirmPassword { get; set; }

    [Required]
    [Display(Name = "Adress")]
    public string Street { get; set; }

    [Required]
    [Display(Name = "Postnummer")]
    public int ZipCode { get; set; }

    [Required]
    [Display(Name = "Stad")]
    public string City { get; set; }

    [Required]
    [Display(Name = "Land")]
    public string Country { get; set; }

    [Required]
    [Display(Name = "Namn på företag")]
    public string Name { get; set; }

    [HiddenInput(DisplayValue = false)]
    private string _companyIdentity { get; set; }

    [HiddenInput(DisplayValue = false)]
    public string CompanyIdentity { get { return _companyIdentity; } }
}

According to Fiddler, this is the post sent from the Ajax call:

POST http://localhost:54213/Account/SaveRegisterDetailsToDb HTTP/1.1
Host: localhost:54213
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:35.0) Gecko/20100101 

Firefox/35.0
Accept: */*
Accept-Language: sv-SE,sv;q=0.8,en-US;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Content-Type: application/json; charset=UTF-8
X-Requested-With: XMLHttpRequest
Referer: http://localhost:54213/Account/Register
Content-Length: 235
Cookie: __RequestVerificationToken=i8CxmZxjAUoxA-u6T9Bw94g-Ysz1Z7WkjAq6HyYw3i69WJR4HUvFr1EGs5WtMDgQASl65ZwOOjkrZIfsFlIP1MqKmKuZzH6Tu2EPo56VFpk1
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache

{"model":{"SurName":"Göran","LastName":"Lassgård","Email":"gustavkaldner@yahoo.se","PhoneNumber":"543543","Password":"hej123","Name":"Gurras Kebab AB","Street":"Tobaksvägen 4","ZipCode":"25497","City":"Istanbul","Country":"Isreal"}}

The problem is that the jQuery Ajax post doesn´t run the "SaveRegisterDetailsToDb" like it´s suppose to.

I´ve set a breakpoint at the start of the Action, but it doesn´t hit it at all.

My simple question is why this Action never gets executed?

Have I missed something obvious?

Answer 1

When using [Authorize] on your controller, you should add the [AllowAnonymous] attribute to your action to allow access to it.