Действие контроллера MVC5 не вызывается из JSON AJAX Post

Question

Я отправляю данные из приложения javascript в контроллер MVC5, однако, когда данные передаются в действие контроллера Submit, он никогда не вызывается. У меня есть некоторые очень простые картографами, которые создают следующий JSON объект:

function mapContactDto(vm) 
{ 
    var contactDto = {}; 
    contactDto.firstName = vm.firstName(); 
    contactDto.lastName = vm.lastName(); 
    contactDto.companyName = vm.companyName(); 
    contactDto.emailAddress = vm.emailAddress(); 
    contactDto.phonePrimary = vm.phonePrimary(); 
    contactDto.phoneSecondary = vm.phoneSecondary(); 
    contactDto.address1 = vm.address1(); 
    contactDto.address2 = vm.address2(); 
    contactDto.city = vm.city(); 
    contactDto.postalCode = vm.postalCode(); 
    contactDto.country = vm.country(); 
    return contactDto; 
} 

function mapCartItems(vm) 
{ 
    var cartItemsDto = new Array(); 
    $.each(vm.selectedOptions(), function (index, step, array) { 
     var sku = step.selection().sku; 
     if (sku !== "0") { 
      cartItemsDto.push(sku); 
     } 
    }); 
    return cartItemsDto; 
} 

/* if i dump the object that is sent to the server with `console.log(JSON.stringify(item))` I get: 

{ 
"skus": ["1001","8GB","201"], 
"contact": { 
    "firstName":"Jon", 
    "lastName":"Doe", 
    "companyName":"Yup my company", 
    "emailAddress":"contact@me.com", 
    "phonePrimary":"012111 231", 
    "phoneSecondary":"", 
    "address1":"1 Billing Way", 
    "address2":"Navigation House", 
    "city":"London", 
    "postalCode":"112211", 
    "country":"GB" 
    } 
} 
*/ 

Затем я отправить данные с помощью следующего кода:

var contactDto = mapContactDto(self.billingVm()); 
var cartItemsDto = mapCartItems(self.configurationVm()); 

var req = new XMLHttpRequest(); 
req.open('HEAD', document.location, false); 
req.send(null); 

var item = { 
    skus: mapCartItems(cartItemsVm()), 
    contact: mapContactDto(billingVm()) 
}; 

var url = '/Knockout/Submit'; 

$.ajax({ 
    cache: false, 
    url: url, 
    contentType: 'application/json; charset=utf-8', 
    dataType: 'json', 
    data: item, 
    type: 'POST', 
    success: function (data, textStatus, jqXHR) {   
    }, 
    error: function (data, textStatus, jqXHR) { 
    } 
}); 

Мой контроллер код ниже:

public JsonResult Submit(string[] Skus, ContactDto Contact) 
{ 
    return Json(new { success = true, message = "Some message" }); 
} 

/* and MVC models are: */ 

public class ContactDto 
{ 
    public string FirstName { get; set; } 
    public string LastName { get; set; } 
    public string CompanyName { get; set; } 
    public string EmailAddress { get; set; } 
    public string PhonePrimary { get; set; } 
    public string PhoneSecondary { get; set; } 
    public string Address1 { get; set; } 
    public string Address2 { get; set; } 
    public string City { get; set; } 
    public string PostalCode { get; set; } 
    public string Country { get; set; } 
} 

У меня есть следующие вопросы:

• Submit никогда не вызывается, если я прокомментирую параметры контроллера, чтобы он стал Submit(), тогда он называется, почему это?

• Из вышеизложенного кажется, что структура контроллера не может соответствовать параметрам - любая идея, что я делаю неправильно, пожалуйста?

• Как включить отладку на контроллере MVC, чтобы я мог видеть, что происходит?

Answer 1

Вам придется сделать два изменения: Stringify ваш JSon, как показано ниже:

$.ajax({ 
    cache: false, 
    url: url, 
    contentType: 'application/json; charset=utf-8', 
    dataType: 'json', 
    data: JSON.stringify(item), 
    type: 'POST', 
    success: function (data, textStatus, jqXHR) {   
    }, 
    error: function (data, textStatus, jqXHR) { 
    } 
}); 

Во-вторых, просто аннотировать метод с [HttpPost], как показано ниже:

[HttpPost] 
public JsonResult Submit(string[] Skus, ContactDto Contact) 
{ 
    return Json(new { success = true, message = "Some message" }); 
} 

Answer 2

Четыре вещи, должен проверяться с помощью ajax-вызовов,
1. Если вы используете объект javascript, вы должны подстроить объект перед его передачей.
2. Глагол действия для метода действия должен быть таким же, как тип вашего вызова ajax, если POST, тогда метод действия должен быть украшен глаголом действия [HttpPost].
3. Всегда используйте относительный путь для URL-адреса в ajax как @ Url.Action («действие», «контроллер»).
4. Входные параметры метода метода действия должны соответствовать параметрам объекта json (точно в зависимости от регистра).

Для отладки вы можете использовать firebug addon в своем браузере, чтобы вы могли видеть, что отправлено по сети, или нажмите F12 для инструмента отладки на этой закладке в сети.