Envoyer liste/tableau en tant que paramètre avec jQuery getJSON

Question

je le suivant où je suis en train d'envoyer la liste/tableau à la méthode du contrôleur MVC:

var id = []; 
var inStock = []; 

$table.find('tbody>tr').each(function() { 
    id.push($(this).find('.id').text()); 
    inStock.push($(this).find('.stocked').attr('checked')); 
}); 

var params = {}; 
params.ids = id; 
params.stocked = inStock; 

$.getJSON('MyApp/UpdateStockList', params, function() { 
    alert('finished'); 
});  

dans mon contoller:

public JsonResult UpdateStockList(int[] ids, bool[] stocked) { } 

à la fois les paramètres sont nuls.

Notez que si je change les params à des éléments simples

params.ids = 1; 
params.stocked = true; 

public JsonResult UpdateStockList(int ids, bool stocked) { } 

il fonctionne ok, donc je ne pense pas que ce soit un problème de routage.

Answer 1

paramétrez la traditional:

$.ajax({ 
    url: '/home/UpdateStockList', 
    data: { ids: [1, 2, 3], stocked: [true, false] }, 
    traditional: true, 
    success: function(result) { 
     alert(result.status); 
    } 
}); 

fonctionne très bien avec:

public ActionResult UpdateStockList(int[] ids, bool[] stocked) 
{ 
    return Json(new { status = "OK" }, JsonRequestBehavior.AllowGet); 
} 

Answer 2

Malheureusement, alors qu'il semble que jquery fournit un drapeau "traditionnel" pour activer ce comportement sur jQuery.ajax, ce n'est pas le cas sur jQuery.getJSON. Une façon de contourner ce problème serait de définir le drapeau globalement:

jQuery.ajaxSettings.traditional = true;

Voir la documentation jQuery.param: http://api.jquery.com/jQuery.param/ Voir aussi les notes de version de ce changement: http://jquery14.com/day-01/jquery-14 (recherche de « traditionnel »)

Answer 3

En plus d'appeler .ajax() au lieu de .getJSON() comme Darin suggère ou mettre le jQuery.ajaxSettings.traditional mondial de true comme jrduncans suggère, vous pouvez également passer le résultat de l'appel the jQuery .param() function sur votre params objet:

var id = []; 
var inStock = []; 

$table.find('tbody>tr').each(function() { 
    id.push($(this).find('.id').text()); 
    inStock.push($(this).find('.stocked').attr('checked')); 
}); 

var params = {}; 
params.ids = id; 
params.stocked = inStock; 

$.getJSON('MyApp/UpdateStockList', $.param(params, true), function() { 
    alert('finished'); 
});  

Answer 4

Dans la vue, générer multiple named fields (non id, comme id doit être unique par champ), notant l'utilisation de Name not name:

@foreach (var item in Model.SomeDictionary) 
{ 
    @Html.TextBoxFor(modelItem => item.Value.SomeString, new { Name = "someString[]" }) 
} 

ensuite récupérer les valeurs de champ d'entrée en utilisant jQuery, so:

var myArrayValues = $('input[name="someString[]"]').map(function() { return $(this).val(); }).get(); 

Vous pouvez utiliser directement jQuery/AJAX comme suit:

$.ajax({ 
    type: "POST", 
    url: "/MyController/MyAction", 
    dataType: 'json', 
    data: { 
     someStrings: $('input[name="someString[]"]').map(function() { return $(this).val(); }).get(), 
     someDates: $('input[name="someDate[]"]').map(function() { return $(this).val(); }).get(), 

Puis, dans l'action du contrôleur dans MVC:

[HttpPost] 
public JsonResult MyAction(string[] someStrings, DateTime[] someDates...