jQueryで複数のオブジェクトをMVC 3コントローラに送信

Question

私はチェックボックスリストとドロップダウンリストを持っています。私は、ドロップダウンリストから選択した値を渡し、チェックボックスをMVC3コントローラに渡し、モデルバインドを使用したいと思います。

チェックボックスのためのViewModel：StateViewModel /Views/Home/EditorTemplates/StateViewModel.cshtmlため

public class StateViewModel 
{ 
    public int Id { get; set; } 
    public string Name { get; set; } 
    public bool Checked { get; set; } 
    public IEnumerable<TransitionViewModel> Transitions { get; set; } 
} 

エディタテンプレート：

@model Mcs.Sibs.UI.Web.Models.StateViewModel 

@Html.HiddenFor(x => x.Id) 
@Html.HiddenFor(x => x.Name) 
<div> 
    @Html.CheckBoxFor(x => x.Checked) 
    @Html.LabelFor(x => x.Checked, Model.Name) 
</div> 

マイビュー：コントローラにデータを送信している

@using (Html.BeginForm("GetSchedules", "Home", FormMethod.Post, new { id = "checkboxFrm" })) 
{ 
    @Html.EditorForModel() 
    <input id="ShowReportScheduleBtn" type="button" value="Show schedule" onclick="ShowReportSchedules()" /> 
} 

ボタンのクリックハンドラ：

function ShowReportSchedules() { 
    var selectedGenerationId = $('#SelectedGenerationId').val(); 
    var statesData = JSON.stringify($('#checkboxFrm')); 
    var statesData2 = $('#checkboxFrm').serialize(); //I also tried this 

     $.ajax({ 
      type: 'POST', 
      url: '/Home/GetSchedules', 
      data: { "generationId": selectedGenerationId, "states": statesData }, 
      dataType: "json", 
      contentType: 'application/json; charset=utf-8' 
     }); 
}; 

最後に、私のコントローラ：

[HttpPost] 
    public ActionResult GetSchedules(int generationId, IEnumerable<StateViewModel> states) 
    { 
     return View("Index"); 

は、私は私のコントローラに値を渡すことはできません。私はjQueryを使わずにstatesDataオブジェクトのみを渡し、私のフォームにはtype="submit"を使用しています。 statesDataとjQueryだけを渡そうとしたときに、type="button" FireBugに「JSONプリミティブが無効です」というエラーが表示されました。

整数+ statesDataオブジェクトを渡そうとすると、IE 9がクラッシュしてFirefoxがハングします。

私は様々なソリューションを試しましたが、成功しませんでした。

Answer 1

このようにしてみてください。

function ShowReportSchedules() { 
    var selectedGenerationId = $('#SelectedGenerationId').val(); 
    $.ajax({ 
     type: 'POST', 
     url: '@Url.Action("getschedules", "home")?generationId=' + selectedGenerationId, 
     data: { states: $('#checkboxFrm').serialize() }, 
     success: function(result) { 
      // Do something with the results 
     } 
    }); 
}; 

Answer 2

var a = $("#a").serialize(); 
var b = $("#b").serialize(); 
var c = $("#c").serialize(); 


$.ajax({ 
      url: '@Url.Content("~/Controller/Method1")', 
      type: 'POST', 
      data: a+b+c, 
      success: function (success) { 
      // do something 
      } 
     }); 

// in Controller 
[HttpPost] 
public ActionResult Method1(abc a, bcd b, xyz c) 
{ 
} 

// where abc, bcd xyz are class