MVC PartialViewResultシグネチャと一致するオブジェクトでAjaxデータ属性を動的に設定する

Question

ajaxデータ属性に1つまたは複数のキー値ペアを設定して、MVCコントローラのアクションまでポストする必要があります。問題は、1つのjs関数を使用して、それぞれ異なる署名を持つ異なるコントローラアクションにデータを送信することです。ここに行く：

MVCビュー

@{ 
    var Params = new List<KeyValuePair<string, string>> 
    { 
     new KeyValuePair<string, string>("param1","foo"), 
     new KeyValuePair<string, string>("param2","bar"), 
    }; 

    var targetUrl = "/MyActionName/"; 
    var myParams = @Json.Encode(Params); 
    var clickFunction = $"myFunction('{targetUrl}', {myParams})"; 
} 

<a href="#" onclick="@(clickFunction)">Do It</a> 

JavaScript関数を

function myFunction(url, paramData) { 

    var dataParams = []; 
    paramData.forEach(function (arrayItem) { 
     var key = arrayItem.Key; 
     var value = arrayItem.Value; 

     dataParams[key] = value; 
    }); 

    // This works 
    $.ajax({ 
     url: url, 
     data: { 
      param1: "foo", 
      param2: "bar" 
     }, 
     success: function (partialViewResult) { 
      $('#TargetDIV').html(partialViewResult); 
     }, 
    }); 

    // This doesn't 
    $.ajax({ 
     url: url, 
     data: { dataParams }, 
     success: function (partialViewResult) { 
      $('#TargetDIV').html(partialViewResult); 
     }, 
    }); 
} 

コントローラアクションの例1

public PartialViewResult MyAction1(string param1, string param2) 
{ 
.... 
} 

コントローラアクションの例2

public PartialViewResult MyAction2(string apple, string orange, string grape) 
{ 
.... 
} 

コントローラアクションの例3

public PartialViewResult MyAction3(string pig, string cow, string dog, string cat) 
{ 
.... 
} 

私はMyFunctionのは、様々なシグネチャを持つ複数のコントローラのアクションにまで掲示するために使用されるようにしたいと思います。だから私はちょうどmyFunctionでKeyValuePairのリストをスローする必要があり、それを処理します。 JSON.stringifyを使っ

1. が、正しい方法でdataParamsをフォーマットしないで：

   は運なしでこれまでにしようとしました。

2. 多くの個別のパラメータの代わりにMVCモデルを使用します。 paramの名前は、私はこの作業を取得することができますので、もし一つのモデルは、すべてのシナリオ

に適合していないだろうに異なりますので、これは私はその後string以外のデータ型を処理するためにそれを拡張するが、簡略化のためにしたい私ここ

任意の助けをstringにこだわった」VEのは非常にそれはあなたが設定するために必要間違っdataParamsある

Answer 1

をいただければ幸い対象

function myFunction(url, paramData) { 

    var dataParams = {}; 
    paramData.forEach(function (arrayItem) { 
     var key = arrayItem.Key; 
     var value = arrayItem.Value; 

     dataParams[key] = value; 
    }); 

    // This works 
    $.ajax({ 
     url: url, 
     data: { 
      param1: "foo", 
      param2: "bar" 
     }, 
     success: function (partialViewResult) { 
      $('#TargetDIV').html(partialViewResult); 
     }, 
    }); 

    // This doesn't 
    $.ajax({ 
     url: url, 
     data: dataParams, 
     success: function (partialViewResult) { 
      $('#TargetDIV').html(partialViewResult); 
     }, 
    }); 
}