asp.net-mvc - form - jquery ajax mvc controller

MVC ajax json publicar en el método de acción del controlador

Question

Estoy tratando de lograr una llamada JQuery AJAX a un método de acción del controlador que contiene un objeto complejo como parámetro. He leído muchos blogs y he probado varias técnicas aprendidas de estos. La publicación clave sobre la que he construido mi código de mejor intento (a continuación) es la publicación de stackoverflow here .

Quiero activar una publicación asincrónica, invocada cuando el usuario selecciona un campo [no una publicación de guardado del formulario, como se demostró en otros ejemplos que he encontrado].

Mi intención es:

• Crear una instancia de un objeto en el cliente [no ViewModel que proporciona el tipo para la vista];
• Rellena el objeto con datos de varios campos en la vista;
• Convierte este objeto a JSON;
• Llame al método de acción del controlador utilizando el método jQuery.Ajax, pasando el objeto JSON.

Los resultados se devolverán como un resultado JSON; y los datos se cargarán en campos en la vista dependiendo de los resultados devueltos.

Los problemas son:

• Si el método de acción se atribuye con el atributo HttpPost, el método de acción del controlador no se invoca (aunque el tipo de llamada AJAX esté configurado como ''POST'').
• Si el método de acción se atribuye con HttpGet, los valores de las propiedades del parámetro son nulos
• El método ReadObject arroja el error: "Expecteding element ''root'' from namespace '''' .. Encontró ''None'' con el nombre ''namespace''".

Espero que alguien pueda ayudar. Gracias. Código a continuación:

Archivo de cliente js

 var disputeKeyDataObj = {
"InvoiceNumber": "" + $.trim(this.value) + "",
"CustomerNumber": "" + $.trim($(''#CustomerNumber'').val()) + ""
};
var disputeKeyDataJSON = JSON.stringify(disputeHeadlineData);
$.ajax({
url: "/cnr/GetDataForInvoiceNumber",
type: "POST",
data: disputeKeyDataJSON,
dataType: ''json'',
contentType: "application/json; charset=utf-8",
success: EnrichedDisputeKeyData(result)
});

Filtro de acción y clase para el tipo asociado con el parámetro del método de acción

 [DataContract]
public class DisputeKeyData
{
[DataMember(Name = "InvoiceNumber")]
public string InvoiceNumber { get; set; }
[DataMember(Name = "CustomerNumber")]
public string CustomerNumber { get; set; }
}

Método de acción en el controlador

 //[HttpPost]
[ObjectFilter(Param = "disputeKeyData", RootType = typeof(DisputeKeyData))]
public ActionResult GetDataForInvoiceNumber(DisputeKeyData disputeKeyData)
{
//Blah!
//....
return Json(disputeKeyData, JsonRequestBehavior.AllowGet);
}

Answer 1

¿Qué versión de asp.net mvc estás usando? La publicación de objetos json en acciones de controlador fuertemente tipadas acaba de agregarse a ASP.NET MVC 3 Beta 1. En This artículo se explica una solución mediante el uso de carpetas modelo para asp.net mvc 2 e información sobre cómo funciona en MVC 3.

Answer 2

Debajo está cómo conseguí que esto funcionara.

El punto clave fue: necesitaba usar ViewModel asociado con la vista para que el tiempo de ejecución pueda resolver el objeto en la solicitud.

[Sé que hay una forma de enlazar un objeto que no sea el objeto ViewModel predeterminado, pero terminé simplemente rellenando las propiedades necesarias para mis necesidades ya que no pude hacer que funcionara]

[HttpPost]
public ActionResult GetDataForInvoiceNumber(MyViewModel myViewModel)
{
var invoiceNumberQueryResult = _viewModelBuilder.HydrateMyViewModelGivenInvoiceDetail(myViewModel.InvoiceNumber, myViewModel.SelectedCompanyCode);
return Json(invoiceNumberQueryResult, JsonRequestBehavior.DenyGet);
}

La secuencia de comandos JQuery solía llamar a este método de acción:

var requestData = {
InvoiceNumber: $.trim(this.value),
SelectedCompanyCode: $.trim($(''#SelectedCompanyCode'').val())
};
$.ajax({
url: ''/en/myController/GetDataForInvoiceNumber'',
type: ''POST'',
data: JSON.stringify(requestData),
dataType: ''json'',
contentType: ''application/json; charset=utf-8'',
error: function (xhr) {
alert(''Error: '' + xhr.statusText);
},
success: function (result) {
CheckIfInvoiceFound(result);
},
async: true,
processData: false
});

Answer 3

Esta publicación de blog aborda directamente su problema.

Utiliza una técnica sin la necesidad de bibliotecas de cliente JSON adicionales. Presenta un complemento jQuery realmente simple que te ayudará a hacer el truco.