web-dev-qa-db-ja.com

IDのリストをAJAXリクエストでMVCのサーバーに渡す方法

MVCのサーバーへのAJAXリクエストで、IDのリストをコントローラーのアクション関数に渡すにはどうすればよいですか？

Htmlヘルパーの使用の有無にかかわらず受け入れます。

int、string、boolのような単純な型に関しては、MVCのモデルバインダーは問題ないことを知っています。

アクションで代わりに配列を使用する必要があるようなものですか？

arrayまたはListを使用する必要があるかどうかは関係ありません。文字列intまたはstringsを使用しても、いつでも変換できます。サーバー上で必要です。現在、マイリストIDはnullを提供します。

JavaScript：

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

MVCアクション：

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

編集： my 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")';
};

解決策：// @aherrickコメントのおかげ。古き良き「伝統」を逃した

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

traditionalパラメータを使用して、trueに設定します。

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

これを試してみてください（私は確認しました）：

$(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 () {

        });
    });

contentTypeがapplication/jsonであり、データが文字列化されていることを確認する必要があります。

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

アクション結果を使用すると、JSONオブジェクトを受け取ることができません。

コントローラーの使用：

[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
            };
        }


}

Javaスクリプト：

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