将对象列表从Razor View传递到Controller只传递一个项目而不是整个列表

时间:2016-08-01 19:48:12

标签: c# asp.net-mvc razor

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

控制器:

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>

部分课程:

(customvoeding和standaardvoeding做同样的事情,只有customvoeding返回一个customvoeding和standaardvoeding的集合返回一个标准版的集合。

public partial class customvoeding
{
    private static foodtrackerEntities1 db = new foodtrackerEntities1();

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

4 个答案:

答案 0 :(得分:0)

你的第二和第三个HTML被破坏了。

<div id="CreateVoedingDiv2" hidden >

删除隐藏的

答案 1 :(得分:0)

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

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

return View(viewModel );

答案 2 :(得分:0)

试试这样。我无法测试,但如果你愿意,我们可以这样推进:

显示所有项目:

<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>

答案 3 :(得分:-1)

我发现是什么阻止了我收到多个结果:

指定模板时,不能将@ Html.EditorFor模板用于多个值。如果您使用不同的模型或不同的模板并不重要,它只是不起作用。

要解决此问题,您必须使用&#39; Html.BeginCollectionItem&#39;库,可以找到here