通过 ajax 将 IEnumerable 模型传递给控制器

Question

我有一个视图，其中将编辑与特定专辑相关的一组图像，以更改其描述并使其封面照片 em>。

EditImageViewModel.cs

public class EditImageViewModel
{
    public int ImageId{get;set;}
    public string ImageUrl{get;set;}
    public string ImageDes{get;set;}
    public bool IsCoverPic{get;set;}
}

从控制器ActionResult 之一，我将model 返回到view 作为 return PartialView("_ImageEditView",model);.

上面返回的model是List<EditImageViewModel>

现在在视图中我显示如下：

_ImageEditView.cshtml

@model IEnumerable<EditImageViewModel>
@using(Html.BeginForm("UpdateImage","Controller",FormMethod.Post))
{
    @foreach(var image in Model)
    {
        <img src="@image.ImageUrl"/>
        @Html.TextAreaFor(m=>image.ImageDes)
        @Html.RadioButtonFor(m=>image.IsCoverPic)
    }
    <button type="submit" class="update" value="Update"></button>
}

我有一段 ajax 代码调用 ActionResult 如下：

$('.update').on('click',function(e){
     e.preventDefault();
     var url=$(this).closest('form').attr('action');
     var formdata=$(this).closest('form').serialize();
     $.ajax({
        url:url,
        data:formdata,
        type:'POST',
        dataType:'JSON',
        success:function(resp){
        },
        error:function(resp){
        }
     })
});

我的控制器ActionResult 是这样的：

[HttpPost]
public ActionResult UpdateImage(List<EditImageViewModel> model)
{
    //actions to be performed
}

我的问题是无论如何，当帖子发生时，model 在控制器中将始终是null。 formdata 在浏览器控制台中检查时具有数据。但它不会传递给控制器​​方法。

在浏览了几篇帖子后，我了解到当使用foreach 时，它会为List 中的多个记录创建重复的ID。所以我把它改成for循环如下：

@model IEnumerable<EditImageViewModel>
@using(Html.BeginForm("UpdateImage","Controller",FormMethod.Post))
{
    @for(int i=0;i<Model.Count();i++)
    {
        <img src="@Model[i].ImageUrl"/>
        @Html.TextAreaFor(m=>m[i].ImageDes)
        @Html.RadioButtonFor(m=>m[i].IsCoverPic)
    }
    <button type="submit" class="update" value="Update"></button>
}

但model 在控制器中接收时仍然为空。我也尝试使用serializeArray 而不是serialize，但并没有太大帮助。我提到了一些帖子，如 Post 1、Post 2 等，但没有一个能解决这个问题。

最终，我怎样才能将这个 模型列表 从 ajax 传递给 controller?

Answer 1

如果你想向控制器发布一个集合，你需要为你的名字添加索引。否则 MVC 不知道如何绑定模型。

例如

@model IEnumerable<EditImageViewModel>
@using(Html.BeginForm("UpdateImage","Controller",FormMethod.Post))
{
    @for(int i=0;i<Model.Count();i++)
    {
        <img src="@Model[i].ImageUrl"/>
        <textarea name="@string.Format("ImageDes[{0}]", i)">@Model[i].imageDes</textarea>
      <input type="radio" name="@string.Format("IsCoverPic[{0}]", i)" value="@Model[i].IsCoverPic" > 

    }
    <button type="submit" class="update" value="Update"></button>
}