web-dev-qa-db-fra.com

Comment passer une liste d'identifiants dans un AJAX demande au serveur dans MVC

Dans une demande AJAX au serveur dans MVC, comment puis-je transmettre une liste d'identifiants à la fonction d'action du contrôleur? 

J'accepte avec ou sans utilisation des aides HTML.

Je sais que le classeur de modèles de MVC n’a aucun problème en ce qui concerne les types simples tels que int, string et bool.

Est-ce que c'est quelque chose comme je dois utiliser et mettre à la place dans l'action?

Peu m'importe si je dois utiliser un array ou List et même si les chaînes I int ou strings je peux toujours les convertir. J'ai juste besoin d'eux sur le serveur. Mon identifiant de liste donne la valeur null pour le moment.

Javascript:

var ids= [1,4,5];
// ajax request with ids..

Action MVC:

public ActionResult ShowComputerPackageBuffer(List<int> ids) // ids are null
{
    // build model ect..
    return PartialView(model);
}

EDIT: Ajout de ma demande AJAX

$(document).ready(function () {
    $('#spanComputerPackagesBuffer').on('click', function () {
        var ids = $('#divComputerPackagesBuffer').data('buffer');
        console.log('bufferIds: ' + bufferIds);
        var data = {
            ids: ids
        };

        var url = getUrlShowComputerPackageBuffer();
        loadTable(url, "result", data);
    });
});

// AJAX's
function loadTable(url, updateTargetId, data) {
    var promise = $.ajax({
        url: url,
        dataType: "html",
        data: data
    })
    .done(function (result) {
        $('#' + updateTargetId).html(result);
    })
    .fail(function (jqXhr, textStatus, errorThrown) {
        var errMsg = textStatus.toUpperCase() + ": " + errorThrown + '. Could not load HTML.';
        alert(errMsg);
    });
};

// URL's
function getUrlShowComputerPackageBuffer() {
    return '@Url.Action("ShowComputerPackageBuffer", "Buffer")';
};

SOLUTIONS: // Merci au commentaire de @aherrick. J'ai raté le bon vieux "traditionnel" 

$.ajax({
    type: "POST",
    url: '@Url.Action("ShowComputerPackageBuffer", "Buffer")',
    dataType: "json",
    traditional: true,
    data: {
        bufferIds: bufferIds
    }
});
javascriptajaxasp.net-mvcasp.net-mvc-4asp.net-mvc-5
6
radbyx

Utilisez le paramètre traditional et définissez-le sur true.

$.ajax({
    type: "POST",
    url: "/URL",
    dataType: "json",
    traditional: true,
    data: {}
});
12
aherrick

Essayez celui-ci (je l'ai vérifié):

$(function () {
        var ids = [1, 4, 5];
        $.ajax({
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            url: '@Url.Action("YourAction", "YourController")',
            data: JSON.stringify( { ids: ids })
        }).done(function () {

        });
    });

Vous devez vous assurer que votre contentType est application/json et que vos données sont codifiées.

6
MacGyver
public ActionResult SaveSomething(int[] requestData) 
//or
public ActionResult SaveSomething(IEnumerable<int> requestData)

Avec Actionresult, vous ne pouvez pas recevoir d’objet JSON:

Utilisation du contrôleur:

[HttpPost]
    [Route( "api/Controller/SaveSomething" )]
    public object SaveTimeSheet( int[] requestData )
    {
        try
        {
            doSomethingWith( requestData );

            return new
            {
                status = "Ok",
                message = "Updated!"
            };
        }
        catch( Exception ex )
        {
            return new
            {
                status = "Error",
                message = ex.Message
            };
        }


}

Javascript:

var ids = [1,4,5];
var baseUrl: 'localhost/yourwebsite'
$.ajax({
                    url: baseUrl + '/api/Controller/SaveSomething',
                    type: 'POST',
                    data: JSON.stringify(ids),
                    dataType: 'json',
                    contentType: 'application/json',
                    error: function (xhr) {
                        alert('Error: ' + xhr.statusText);
                    },
                    success: function (result) {
                        if (result != undefined) {
                            window.location.href = window.location.href;
                        }
                    },
                    async: false,
                });
1
SilentTremor