将对象列表从Razor视图传递给Controller只传递一个项,而不是整个列表

本文关键字:列表 一个 Razor 对象 视图 Controller | 更新日期: 2023-09-27 17:59:40

我想使用编辑器模板将VoedingBindingModel的列表传递给我的控制器,但我只收到控制器中列表的第一个条目,而不是所有条目。

控制器:

public ActionResult Create()
    {
        ViewBag.fk_customVoedingId = new SelectList(customvoeding.GetAllCustomvoeding(), "customVoedingId", "customVoedingNaam");
        ViewBag.fk_standaardVoedingId = new SelectList(standaardvoeding.GetAllStandaardvoeding(), "standaardVoedingId", "standaardVoedingNaam");
        return View();
    }
    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create([Bind(Include = "Id,Datum,Tijd,VoedingCollection")]AgendaBindingModel agendaBindingModel)
    { 
        //Do something
    }

型号:

public class AgendaBindingModel
    {
      [Required]
       public List<VoedingBindingModel> VoedingCollection { get; set; }
       //More properties
    }

视图:

@using Website.Models
@model AgendaBindingModel
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
    <h4>agenda</h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(model => model.Datum, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.Datum, "{0:dd-MM-yyyy}", new { @class = "form-control-datepicker", placeholder = "DD-MM-YYYY", maxlength = "10" })
            @Html.ValidationMessageFor(model => model.Datum, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Tijd, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Tijd, "{0:hh:mm}", new { htmlAttributes = new { @class = "form-control-timepicker", placeholder = "hh:mm", maxlength = "5" } })
            @Html.ValidationMessageFor(model => model.Tijd, "", new { @class = "text-danger" })
        </div>
    </div>
    <div id="CreateVoedingDiv0">
        @Html.EditorFor(x => x.VoedingCollection[0])
    </div>
    <div id="CreateVoedingDiv1"hidden>
        @Html.EditorFor(x => x.VoedingCollection[1])
    </div>
    <div id="CreateVoedingDiv2"hidden>
        @Html.EditorFor(x => x.VoedingCollection[2])
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input value="Add" class="btn btn-default" onclick="ShowVoeding()" /> <input value="Remove" class="btn btn-default" onclick="HideVoeding()" />
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Create" class="btn btn-default" />
        </div>
    </div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<script>
var count = 1;
function ShowVoeding()
{
    if (document.getElementById("CreateVoedingDiv" + count).hidden == true)
    {
        document.getElementById("CreateVoedingDiv" + count).hidden = false;
        count++;
    }
}
function HideVoeding()
{
    count = count - 1;
    if (document.getElementById("CreateVoedingDiv" + count).hidden == false)    {
        document.getElementById("CreateVoedingDiv" + count).hidden = true;            
    }
}
</script>

部分类别:

(客户和标准化做同样的事情,只有客户返回客户的集合,标准化返回标准化的集合。

public partial class customvoeding
{
    private static foodtrackerEntities1 db = new foodtrackerEntities1();
    public static List<customvoeding> GetAllCustomvoeding()
    {
        db.Configuration.LazyLoadingEnabled = false;
        return db.customvoeding.ToList();
    }
}

将对象列表从Razor视图传递给Controller只传递一个项,而不是整个列表

您似乎没有初始化模型并将其传递给视图。在控制器的操作方法中,尝试添加:

var viewModel = new AgendaBindingModel();
viewModel.VoedingCollection = // TODO: Fill the list from your data source
return View(viewModel );

这样试试。我不能测试,但如果你喜欢我们可以这样前进:

显示所有项目:

<div id="group">
@for(int i = 0; i < AgendaBindingModel.VoedingCollection.Count; i++)
{
    @Html.EditorFor(x => x.VoedingCollection[i])
}
To add new item:
<button onclick=newItem() >+</button>
</div>

<script>
function newItem(){
    var div = document.createElement('div');
    div.id = CreateNewItem;
    div.innerHTML = '@Html.EditorFor(x => x.VoedingCollection[i])';
    document.body.appendChild(div);
}
</script>

您的第二个和第三个html已损坏。

<div id="CreateVoedingDiv2"hidden>

删除隐藏的

我发现了阻止我接收多个结果的原因:

您不能使用@Html。编辑器指定模板时,用于超过1个值的模板。使用不同的模型或不同的模板并不重要,只是根本不起作用。

要修复它,您必须使用'Html。BeginCollectionItem库,可在此处找到。