web-dev-qa-db-fra.com

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

J'ai le suivant où j'essaye d'envoyer la liste/tableau à la méthode de 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) { }

les deux paramères sont nuls.

Notez que si je change les paramètres en un seul élément

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

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

alors cela fonctionne bien, donc je ne pense pas que ce soit un problème de routage.

23
fearofawhackplanet

Essayez de définir le drapeau traditional:

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

fonctionne bien avec:

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

En plus d'appeler .ajax() au lieu de .getJSON() comme Darin le suggère ou de définir le jQuery.ajaxSettings.traditional global à true comme le suggère jrduncans, vous pouvez également transmettre le résultat de l'appel à la fonction jQuery .param() sur votre objet params:

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');
});    
20
hippietrail

Malheureusement, bien qu'il semble que jquery fournisse un indicateur "traditionnel" permettant de basculer ce comportement sur jQuery.ajax, il n'en va pas de même sur jQuery.getJSON. Une façon de contourner ce problème serait de placer le drapeau au niveau mondial:

jQuery.ajaxSettings.traditional = true;

Consultez la documentation de jQuery.param: http://api.jquery.com/jQuery.param/ Consultez également les notes de publication de cette modification: http://jquery14.com/day-. 01/jquery-14 (recherche de 'traditionnel')

6
jrduncans

Dans la vue, générez plusieurs champs nommés (pas id, car id doit être unique par champ), en notant l'utilisation de Name ET NON name :

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

Récupérez ensuite les valeurs du champ d'entrée à l'aide de jQuery, so :

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

Vous pouvez l’utiliser directement dans 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(),

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

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