Question

如何从html视图向控制器发送模型数组。在这段代码中，我在控制器参数上收到null。

public class PropModel
{
    public string Name { get; set; }
    public string Value { get; set; }
}

[HttpPost]
public ActionResult Index(PropModel[] model)
{
        foreach (var r in model)
        {
            //Do somethings
        }
        return View();
}

查看：

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title></title>
</head>
<body>
    <div>

        @using (Html.BeginForm())
        {
            for (int i = 0; i < 3; i++)
            {
                @Html.TextBox("Name")
                @Html.TextBox("Value")
            <br/>
            }
            <input type="submit" value="submit"/>
        }
    </div>
</body>
</html>

Answer 1

@model List<PropModel>
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title></title>
</head>
<body>
    <div>

        @using (Html.BeginForm())
        {
            for (int i = 0; i < 3; i++)
            {
                @Html.TextBoxFor(m=>this.Model[i].Name)
                @Html.TextBoxFor(m=>this.Model[i].Value)
            <br/>
            }
            <input type="submit" value="submit"/>
        }
    </div>
</body>
</html>

神奇之处在于你如何命名输入字段。

Answer 2

我可能错了，但我认为控制器会将该帖子解释为Name的数组和Value的数组。您可以尝试更新方法签名：

[HttpPost]
public ActionResult Index(string[] Name, string[] Value)
{

}

或者使用JSON将您的“模型”构建为对象数组。

Answer 3

您可以使用 EditorTemplates 来处理这种情况。

让我们为我们的观点制作一个新的视图模型。

public class PropListVM
{
    public List<PropModel> Props { set; get; }
    public PropListVM()
    {
        Props = new List<PropModel>();
    }
}

现在，在我们的GET操作中，我们将创建此新视图模型的对象，设置Props集合并发送到我们的视图。

public ActionResult Index()
{           
    var vm = new PropListVM { Props = GetPropsFromSomeWhere() };
    return View(vm);
}
private List<PropModel> GetPropsFromSomeWhere()
{
    var list = new List<PropModel>();
    //Hard coded for demo. You may replace it with DB items
    list.Add(new PropModel { Name = "Detroit", Value = "123" });
    list.Add(new PropModel { Name = "Ann Arbor", Value = "345" });
    return list;
}

现在让我们创建一个 EditorTemplates 。转到~/Views/YourControllerName并创建一个名为“EditorTemplates”的文件夹，并在其中创建一个与属性名称相同名称的新视图（PropModel.cshtml）

enter image description here

将此代码添加到新的编辑器模板中。

@model ReplaceYourNameSpaceHere.PropModel
<div>
    Name :@Html.TextBoxFor(s=>s.Name) <br />
    Value : @Html.TextBoxFor(s=>s.Value)
</div>

确保将ReplaceYourNameSpaceHere替换为PropModel类可用的实际命名空间。

现在让我们回到原始视图（Index.cshtml），该视图是我们PropListVM视图模型的一个实例的强类型。

@model ReplaceYourNameSpaceHere.PropListVM
@using (Html.BeginForm())
{
<div>
    @Html.EditorFor(s=>s.Props)        
    <input type="submit" value="submit"/>
</div>
}

现在让我们有一个动作方法来处理表单发布，你将有一个PropListVM类型的参数，MVC模型绑定将从发布的表单绑定这些对象的属性。您可以检查此对象的Props属性并遍历每个项目。

[HttpPost]
public ActionResult Index(PropListVM model)
{
    foreach (var prop in model.Props)
    {
        string s = prop.Name;
        //Do cool somethings
    }
    // return or redirect now
    //If we are returning the posted model back to the form, 
    //reload the Props property.
    model.Props = GetPropsFromSomeWhere();
    return View(model);
}

结果是??? 利润!!!!!!

在我的示例中，我发送了2个PropModel项，其中包含Name和Value属性集。但是如果您想要一些空表单，只需添加PropModel个对象而不初始化任何属性值。 enter image description here

将数组表单传递给控制器

3 个答案: