用jQuery发送多个对象到MVC 3控制器

本文关键字:MVC 控制器 对象 jQuery | 更新日期: 2023-09-27 18:02:20

我有一个复选框列表和下拉列表。我想从下拉列表和复选框中选择值传递给我的MVC3控制器,并使用模型绑定。

ViewModel for checkbox:

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

statviewmodel /Views/Home/EditorTemplates/StateViewModel.cshtml编辑器模板:

@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");

我无法向控制器传递值。我已经设法通过只有statesData对象没有jQuery和使用type="submit"在我的形式。当我试图通过只有statesData与jQuery和type="button"我得到了"无效的JSON原语"错误在FireBug。

当我试图传递整数+ statesData对象时,IE 9崩溃,Firefox挂起。

用jQuery发送多个对象到MVC 3控制器

我已经尝试了各种方法,但都不成功。

试试:

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