MVC 4 Razor adding input type date

Question

I m wondering how to insert a  lt input type  date   gt  for datetime attributes of my model   As for now Razor creates a plain input element with type  datetime   I want to make use of the new input types of HTML5

User · Answer

The input date value format needs the date specified as per http://tools.ietf.org/html/rfc3339#section-5.6 full-date.

So I've ended up doing:

<input type="date" id="last-start-date" value="@string.Format("{0:yyyy-MM-dd}", Model.LastStartDate)" />

I did try doing it "properly" using:

[DataType(DataType.Date)]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
public DateTime LastStartDate
{
    get { return lastStartDate; }
    set { lastStartDate = value; }
}

with

@Html.TextBoxFor(model => model.LastStartDate, 
    new { type = "date" })

Unfortunately that always seemed to set the value attribute of the input to a standard date time so I've ended up applying the formatting directly as above.

Edit:

According to Jorn if you use

@Html.EditorFor(model => model.LastStartDate)

instead of TextBoxFor it all works fine.

User · Answer

I managed to do it by using the following code    Html TextBoxFor model   gt  model EndTime  new   type    time

User · Answer

You will get it by tag type  date    then it will render beautiful calendar and all      Html TextBoxFor model   gt  model EndTime  new   type    date

User · Answer

Html TextBoxFor m   gt  m EntryDate  new  type    date       or type    time    it will display a calendar  it will not work if you give  Html EditorFor

User · Answer

If you want to use  Html EditorFor   you have to use jQuery ui and  update your Asp net Mvc to 5 2 6 0 with NuGet Package Manager    Html EditorFor m   gt  m EntryDate  new   htmlAttributes   new    class    datepicker            section Scripts     Scripts Render    bundles jqueryval        lt script gt         document  ready function               datepicker   datepicker                lt  script gt

[html] MVC 4 Razor adding input type date

Examples related to html

Examples related to razor

Examples related to asp.net-mvc-4