¿Cómo paso esta matriz js a mi controlador MVC 3?

Question

Estoy obteniendo valores nulos en el controlador. No estoy seguro de qué me estoy perdiendo.

Tengo una cuadrícula donde tengo una lista de invitados (con el nombre & correo electrónico) donde el usuario selecciona invitado por casilla de verificación.

Luego leo el nombre y los correos electrónicos de los contactos seleccionados y construyo la matriz js. Luego esta matriz se pasa al MVC 3 controller.

código JS:

var name ='', email=''; 
    var guest = new Array(); 
      var guests = new Array(); 
      $('.CBC').each(function() { //loop grid by checkbox class 
       if (this.checked) { 
        name = GetSelectedName(); 
        email = GetSelectedEmail(); 
        guest = { 'Email': email, 'Name': name }; 
        guests.push(guest); 
       } 
      }); 

     $.ajax({ 
     type: "POST", 
     url: GetURL(), 
     data: guests, 
     dataType: "json", 
     success: function (res) { 
      //do something 
     } 
}); 

controlador:

[HttpPost] 
    public ActionResult AddGuests(List<SelectedGuest> guests) 
    {    
     GuestService svc = new GuestService(); 
     //do something with guests 
     //But Name and Email of all items in guests are null!!! 
    } 

public class SelectedGuest 
{ 
    //represent the email columns of the contact grid 
    public string Email { get; set; } 

    //represent the Name column of the contact grid 
    public string Name { get; set; } 
} 

¿Es necesario convertir explícitamente matriz js al objeto JSON serializar?

Answer 1

Si usted tiene la libertad de utilizar un plugin, tratar jQuery-JSON:

var guests = new Array(); 

// push stuff into the array 

$.ajax({ 
    type: "POST", 
    url: GetURL(), 
    data: $.toJSON(guests), 
    dataType: "json", 
    success: function (res) { 
     //do something 
    } 
); 

Answer 2

Tal vez el cambio de la configuración tradicional true puede ayudar. Aquí está el código (modificado) que utilicé para publicar identificadores únicos (Guids) para la acción del controlador.

var yourArray = new Array(); 
// TODO: fill array with ids of checked checkboxes 
$('.CBC:checked').each(function() { 
    yourArray.push($(this).attr('myId')); 
}); 

var postData = { 
    yourArray: yourArray 
}; 

$.ajax({ 
    type: "POST", 
    url: "/ctrl/ActionName", 
    data: postData, 
    success: function (result) { 
    }, 
    datatype: "json", 
    traditional: true 
}); 

En el controlador tengo la siguiente acción.

[HttpPost] 
public ActionResult ActionName(List<Guid> yourArray) 
{ 
    return View(); 
} 

Answer 3

También puede crear un encuadernador de modelo personalizado. Esto le permite escribir el código que toma la entrada sin procesar del objeto de solicitud y crear un objeto a partir de él. Esto le permitiría crear una lista de cadenas o cualquier otra cosa que le gustaría ver como un objeto en su controlador. También es muy reutilizable.

Answer 4

$.ajax({ 
      type: "POST", 
      url: "yourUrl", 
      data: JSON.stringify(yourArray), 
      contentType: "application/json; charset=utf-8" 
     }); 

contentType: "application/json; charset = UTF-8" - es parte muy importante

[HttpPost] 
public void Fake(List<yourType> yourArray) 
{ 
} 

Answer 5

Usted recibe nula debido a que está enviando la matriz JSON en el camino equivocado.

primer lugar, debe serializar la matriz JSON:

$.ajax({ 
     // Whatever ... 
     type: "POST", 
     url: "yourUrl", 
     data: JSON.stringify(guests), 
     // Whatever ... 
    }); 

En segundo lugar, el controlador debe recibir una cadena:

[HttpPost] 
public ActionResult ActionName(string guests) 
{ 
    // ... 
} 

y, por último, se debe deserializar esa cadena al tipo relacionada:

[HttpPost] 
public ActionResult ActionName(string guests) 
{ 
    // this line eserializes guests ... 

    IList<GuestType> gs = 
     new JavaScriptSerializer().Deserialize<IList<GuestType>>(guests); 

    // ... Do whatever with gs ... 

    return View(); 
} 

Answer 6

Intenté esto, está funcionando.

var name ='', email=''; 
var guest = new Array(); 
     var guests = new Array(); 
     $('.CBC').each(function() { //loop grid by checkbox class 
      if (this.checked) { 
       name = GetSelectedName(); 
       email = GetSelectedEmail(); 
       guest = { 'Email': email, 'Name': name }; 
       guests.push(guest); 
      } 
     }); 

var PostData = { guests: guests }; //if this is creating ambiguity try using something:guest //(something is //controller parameter, change your controller parameter accordingly)    

    $.ajax({ 
    type: "POST", 
    url: GetURL(), 
    data: PostData , 
    dataType: "json", 
    success: function (res) { 
     //do something 
    } 
}); 

Cheers,

Srinivas

Answer 7

acaba de establecer la 'tradicional: true" en su ajax.

Ejemplo:

$.ajax({ 
    type: "POST", 
    url: GetURL(), 
    data: PostData , 
    dataType: "json", 
    traditional:true, 
    success: function (res) { 
     //do something 
    } 
});