Envoyer un tableau de chaînes à la méthode API web

Question

voici mon appel ajax côté client :

    var list = ["a", "b", "c", "d"];

    var jsonText = { data: list };

    $.ajax({
        type: "POST",
        url: "/api/scheduledItemPriceStatus/updateStatusToDelete",
        data: jsonText,
        dataType: "json",
        traditional: true,
        success: function() { alert("ça a fonctionné!"); },
        failure: function() { alert("ça ne fonctionne pas..."); }
    });

voici l'en-tête réseau de Chrome :

Adresse URL de la demande : http://localhost:2538/api/scheduledItemPriceStatus/updateStatusToDelete

Méthode de la demande : POST

En-têtes de requête voir la source

Accepter: application/json, text/javascript, */*; q=0.01

Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3

Accept-Encoding: gzip,deflate,sdch

Langue acceptée : en-US,en;q=0.8

Connexion: keep-alive

Longueur du contenu : 27

Type de contenu: application/x-www-form-urlencoded; charset=UTF-8

Hôte: localhost:2538

Origine: http://localhost:2538

Référent : http://localhost:2538/Pricing/ScheduledItemPrices

User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.97 Safari/537.11

X-Requested-With: XMLHttpRequest

Données du formulaire encodées en URL

data: a
data: b
data: c
data: d

voici ma méthode de contrôleur WebAPI :

public HttpResponseMessage UpdateStatusToDelete(string[] data)

résultat :

quand je débogue, le paramètre data dans UpdateStatusToDelete renvoie {string[0]} au lieu de data: a data: b data: c data: d

Qu'est-ce que je fais mal ? Toute aide est vraiment appréciée.

Answer 1

Le paramètre dataType ne vous aidera pas.

Voici comment je le fais :

var SizeSequence = {};
SizeSequence.Id = parseInt(document.querySelector("dd#Sequence_Id").textContent);
SizeSequence.IncludedSizes = [];
var sizes = document.querySelectorAll("table#IncludedElements td#Size_Name");
// en sautant la première ligne (modèle)
for (var i = 1, l = sizes.length ; i != sizes.length ; SizeSequence.IncludedSizes.push(sizes[i++].textContent));

$.ajax("/api/SizeSequence/" + SizeSequence.Id, { 
     method: "POST",
     contentType: "application/json; charset=UTF-8",
     data: JSON.stringify(SizeSequence.IncludedSizes), 
...

La Partie Serveur

// /api/SizeSequence/5
public async Task PostSaveSizeSequence(int? Id, List IncludedSizes)
    {
        if (Id == null || IncludedSizes == null || IncludedSizes.Exists( s => String.IsNullOrWhiteSpace(s)))
            return BadRequest();
        try
        {

            await this.Repo.SaveSizeSequenceAsync(Id.Value, IncludedSizes );
            return Ok();
        }
        catch ( Exception exc)
        {
            return Conflict();
        }
    }

Références

jQuery.ajax()

Answer 2

Vous pouvez également le faire avec JSON.stringify, ce qui semble plus intuitif d'un point de vue sémantique que de mettre les choses dans un objet avec une clé vide. (J'utilise Web API 2, je ne sais pas si cela a de l'importance.)

Code client

$.ajax({
    type: 'POST', //fonctionne également pour PUT ou DELETE
    url: '/api/UserRole',
    contentType: "application/json",
    data: JSON.stringify(["nom1", "nom2"])
})

Code serveur

[HttpPost]
[Route("api/UserRole")]
public IHttpActionResult AddUsers(string[] nomsUtilisateurs)