Search code examples
asp.net-mvcasp.net-mvc-5entity-framework-6editorforicollection

MVC5 with EF6 : EditorFor() with an ICollection


I have a problem with my MVC5/EF6 website. I have a model like this :

model
(source: hostingpics.net)

When I'm creating an activity, I would like to add at least one date to it. So I created a new field in the form :

<div class="form-group">
     @Html.LabelFor(model => model.Days, new { @class = "control-label col-md-2" })
     <div class="col-md-10">
         @Html.EditorFor(model => model.Days)
         @Html.ValidationMessageFor(model => model.Days)
     </div>
</div>

According to various sources I've read here and there (https://stackoverflow.com/a/11403858/360708), I must create a file Day.cshtml in View/Shared/EditorTemplates/ so that I can tell MVC I want Day to have an editor for "day1" (DatePicker here).

This is because my model Day is an ICollection inside Activity, so I can't access the field day1 like this : "model.Days.day1". I've tried creating the Day.cshtml but it doesn't work. Here's the content of Day.cshtml

@model GAS_VS2013.Models.Day

@Html.EditorFor(o => o.day1)

Am I forgetting something or doing something wrong ?

Thanks


Solution

  • Thanks to Fals, it's now working with :

    <div class="form-group">
         @Html.LabelFor(model => model.Days, new { @class = "control-label col-md-2" })
         <div class="col-md-10">
             @Html.EditorFor(model => model.Days, "Day")
             @Html.ValidationMessageFor(model => model.Days)
         </div>
    </div>
    

    To display the textbox as a HTML5 DatePicker, don't forget to add a DateTime.cshtml in the EditorTemplates with the following code (type of your day field must be DateTime) :

    @model Nullable<DateTime>
    @{
       DateTime dt = DateTime.Now;
       if (Model != null)
       {
          dt = (System.DateTime)Model;
       }
       @Html.TextBox("", String.Format("{0:d}", dt.ToShortDateString()), new { @class = "form-control datecontrol", type = "date" })
    }
    

    Source : http://www.aubrett.com/InformationTechnology/WebDevelopment/MVC/DatePickerMVC5.aspx(