web-dev-qa-db-ja.com

AJAXを介して配列をmvcアクションに渡します

AJAXを介してMVCアクションにintの配列(またはIEnumerable)を渡そうとしていますが、少し助けが必要です。

javaScriptは

$.get('/controller/MyAction', { vals: arrayOfValues }, function (data) {...

コントローラーのアクションは

public ActionResult MyAction(IEnumerable<int> arrayOfValues )

現時点では、リクエストは次のようにフォーマットされています

controller/MyAction?_=1301503418429&arrayOfValues[]=491&arrayOfValues[]=368&arrayOfValues[]=235&arrayOfValues[]=437

だから私はほとんどそこにいます、角かっこを外すと正しい応答が得られます。コントローラがそれが何であるかを認識できるように、どのように私の配列にその配列を渡す必要がありますか?

助けてくれて本当にありがとうございます

デイブ

120
Dave

Get呼び出しを行う前に、従来のプロパティをtrueに設定します。すなわち:

jQuery.ajaxSettings.traditional = true

$.get('/controller/MyAction', { vals: arrayOfValues }, function (data) {... 
147
Chandu

過去にPOSTを実行しようとしたときに問題が発生しました(それが正確に実行されているかどうかはわかりませんが、配列を渡すときに思い出しますtraditionalをtrueに設定する必要があります

 var arrayOfValues = new Array();

 //Populate arrayOfValues 
 $.ajax({ 
      type: "POST",
      url: "<%= Url.Action("MyAction","Controller")%>",
      traditional: true,
      data: { 'arrayOfValues': arrayOfValues }              
 });
114
Rion Williams

かなり遅いですが、ここにすでに存在するものへの異なる答え:

$.ajaxの代わりに、速記機能 $.get または $.post を使用したい場合、この方法で配列を渡すことができます:


Shorthand GET

var array = [1, 2, 3, 4, 5];
$.get('/controller/MyAction', $.param({ data: array }, true), function(data) {});


// Action Method
public void MyAction(List<int> data)
{
    // do stuff here
}

ショートハンドPOST

var array = [1, 2, 3, 4, 5];
$.post('/controller/MyAction', $.param({ data: array }, true), function(data) {});


// Action Method
[HttpPost]
public void MyAction(List<int> data)
{
    // do stuff here
}


ノート:

  • $.param のブールパラメータは traditional プロパティ用です。これが機能するためにはtrueでなければなりません
49
SNag

「従来の」オプションを使用する答えは正しいです。もっと知りたいと思う人のために、もう少し背景情報を提供しています。

JQueryドキュメントから:

JQuery 1.8以降、$。param()メソッドはデフォルト設定としてjQuery.ajaxSettings.traditionalを使用しなくなり、デフォルトでfalseになります。

また、こちらをご覧ください: http://michaelsync.net/2012/04/05/tips-asp-net-mvc-javascriptserializer-3-questions-and-3-answers および- http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx

HTH

9
Tom Gerken

これをうまくできるはずです:

$.ajax({
   url: 'controller/myaction',
   data: JSON.stringify({
      myKey: myArray
   }),
   success: function(data) { /* Whatever */ }
});

次に、アクションメソッドは次のようになります。

public ActionResult(List<int> myKey)
{
    // Do Stuff
}

あなたにとっては、値を文字列化するだけでいいようです。 MVCのJSONValueProviderは、それを変換してIEnumerableに戻します。

7
Tejs

他のすべてが失敗した場合...

ここでの他の答えはどれも私の問題を解決しませんでした。 JavaScriptからMVC Web APIコントローラーへのGETメソッド呼び出しを行い、そのリクエスト内のパラメーターとして整数の配列を送信しようとしました。ここですべてのソリューションを試してみましたが、それでもコントローラーのパラメーターがNULL(またはVBユーザー用のNothing)になりました。

最終的に私のソリューションは different SO post で見つかりましたが、実際には本当に簡単でした。コントローラーの配列パラメーターの前に[FromUri]アノテーションを追加するだけです(「従来の」AJAX設定を使用して呼び出しを行う必要がありました。これは、ブラケットアノテーションを回避するためです)。 アプリケーションで使用した実際のコードについては、以下を参照してください。


コントローラー署名:

Controller Signature注:C#の注釈は[FromUri]になります


JavaScript:

$.get('/api/InventoryApi/GetBalanceField', $.param({productIds: [42], inventoryFormId: 5493, inventoryBalanceType: 'Beginning'},true)).done(function(data) {console.log(data);});

実際のURL文字列:

http://randomhostname/api/InventoryApi/GetBalanceField?productIds=42&inventoryFormId=5493&inventoryBalanceType=Beginning
2
Lopsided

私のように.Net Framework MVCからASP.NET Core MVCに移行する場合、状況はわずかに変わりました。 ajax呼び出しは、{ vals: arrayOfValues }のデータを渡すのではなく、stringifyを使用するrawオブジェクトで行う必要があります。次のようにJSON.stringify(arrayOfValues)にする必要があります。

$.ajax({
   url: 'controller/myaction',
   data: JSON.stringify(arrayOfValues),
   success: function(data) { /* Whatever */ }
});

ASP.NET Coreで行われた他の変更は、クロスサイトリクエストフォージェリを防止することです。そのため、ajaxメソッドからMVCアクションを呼び出すには、次のように[FromBody]属性をアクションパラメーターに適用する必要があります。

public ActionResult MyAction([FromBody] IEnumerable<int> arrayOfValues )
1

ここで少し遅れましたが、SNagのソリューションをさらに$ .ajax()に使用できました。誰にも役立つコードは次のとおりです。

var array = [1, 2, 3, 4, 5];

$.ajax({
    type: "GET",
    url: '/controller/MyAction',
    data: $.param({ data: array}, true),
    contentType: 'application/json; charset=utf-8',
    success: function (data) {
    },
    error: function (x, y, z) {
    }
});

// Action Method
public void MyAction(List<int> data)
{
    // do stuff here
}
0
Saket

ASP.NET Core MVCを使用していて、角括弧を処理する必要がある場合(jQueryの「従来の」オプションを使用するのではなく)、私が見つけた唯一のオプションはIEnumerable contollerメソッド。

string arrayKey = "p[]=";
var pArray = HttpContext.Request.QueryString.Value
    .Split('&')
    .Where(s => s.Contains(arrayKey))
    .Select(s => s.Substring(arrayKey.Length));
0
x5657