Date only from TextBoxFor

Question

I m having trouble displaying the only date part of a DateTime into a textbox using TextBoxFor lt    expression  htmlAttributes    The model is based on Linq2SQL  field is a DateTime on SQL and in the Entity model   Failed    lt    Html TextBoxFor model   gt  model dtArrivalDate  String Format   0 dd MM yyyy    Model dtArrivalDate    gt    This trick seems to be depreciated  any string value in the object htmlAttribute is ignored   Failed    DisplayFormat  DataFormatString     0 dd MM yyyy      public string dtArrivalDate   get  set      I would like to store and display only the date part on the details edit view  without the  00 00 00  part

User · Answer

I use Globalize so work with many date formats so use the following    Html TextBoxFor m   gt  m DateOfBirth    0 d      This will automatically adjust the date format to the browser s locale settings

User · Answer

MVC4 has solved this problem by adding a new TextBoxFor overload  which takes a string format parameter  You can now simply do this    Html TextBoxFor m   gt  m EndDate    0 d MMM yyyy      There s also an overload that takes html attributes  so you can set the CSS class  wire up datepickers  etc    Html TextBoxFor m   gt  m EndDate    0 d MMM yyyy    new    class  input-large

User · Answer

The DisplayFormat attribute did not work for me in either form upon initial load   I created an EditorTemplate instead    lt    Control Language  C   Inherits  System Web Mvc ViewUserControl lt System DateTime gt     gt   lt    Import Namespace  System Web Mvc Html    gt   lt        Html TextBox     Model ToShortDateString    new    class    date-range       gt

User · Answer

Just add next to your model    DataType DataType Date   public string dtArrivalDate   get  set

User · Answer

Keep in mind that display will depend on culture  And while in most cases all other answers are correct  it did not work for me  Culture issue will also cause different problems with jQuery datepicker  if attached   If you wish to force the format escape   in the following manner    Html TextBoxFor model   gt  model dtArrivalDate    0 MM   dd   yyyy      If not escaped for me it show 08-01-2010 vs  expected 08 01 2010   Also if not escaped jQuery datepicker will select different defaultDate  in my instance it was May 10  2012

User · Answer

When using tag helpers in ASP NET Core  the format needs specified in ISO format   If not specified as such  bound input data won t display properly and will show as mm dd yyyy with no value   Model    Display Name    Hire     DataType DataType Date    DisplayFormat ApplyFormatInEditMode   true  DataFormatString     0 yyyy-MM-dd     public DateTime  HireDate   get  set      View    lt input asp-for  Entity HireDate  class  form-control    gt    The format can also be specified in the view using the asp-format attribute   The resulting HTML will look as follows    lt input class  form-control  type  date  id  Entity HireDate       name  Entity HireDate  value  2012-01-01  gt

User · Answer

Don t be afraid of using raw HTML    lt input type  text  value   lt    Html Encode Model SomeDate ToShortDateString      gt     gt

User · Answer

Sure you can use Html EditorFor  But if you want to use TextBoxFor and use format from DisplayFormat attribute you can use it in this way    Html TextBoxFor model   gt  model dtArrivalDate  ModelMetadata FromLambdaExpression model   gt  model dtArrivalDate  ViewData  EditFormatString    or create next extension   public static class HtmlExtensions       public static MvcHtmlString TextBoxWithFormatFor lt TModel  TProperty gt  this HtmlHelper lt TModel gt  htmlHelper  Expression lt Func lt TModel  TProperty gt  gt  expression  object htmlAttributes                return htmlHelper TextBoxFor expression  ModelMetadata FromLambdaExpression expression  htmlHelper ViewData  EditFormatString  htmlAttributes

User · Answer

net Razor problems DateTime   Models public class UsuarioFecha           DataType DataType DateTime            DisplayFormat DataFormatString    quot  0 yyyy MM dd  quot   ApplyFormatInEditMode   true           public DateTime  dateXXX   get  set       view   model proyect Models UsuarioFecha      Html TextBoxFor m   gt  m dateXXX   new   Value    Html DisplayFor m   gt  m dateXXX     class    quot form-control quot    type    quot date quot

User · Answer

The Template Editor will work for display purposes only  If you use the same editor  which makes sense because its an editor  and you supplied a value like 31 01 2010  - you ll get an error message saying the format is invalid

User · Answer

If you insist on using the  DisplayFormat   but you are not using MVC4  you can use this    Html TextBoxFor m   gt  m EndDate  new   Value    Html DisplayFor m  gt m EndDate    class  datepicker

User · Answer

DisplayName  Start Date     DisplayFormat ApplyFormatInEditMode   true  DataFormatString     0 yyyy-MM-dd     public DateTime StartDate   get  set      Then    lt   Html EditorFor m   gt  m StartDate    gt

User · Answer

lt    Html TextBoxFor model   gt  model EndDate  new    class    jquery datepicker    Value   Model EndDate ToString  dd MM yyyy       gt

User · Answer

You can also use the HTML 5 attributes by applying this data annotation    DataType DataType Date     But the problem is this enables a browser specific date picker for HTML 5 browsers   You still need your own date picker for browsers without support  and then you have to make sure your date picker doesn t appear in addition to a browser s  Modernizr can do this easily   or hide the browser s if it does complicated and I don t know how reliable methods I saw were      In the end I went with Alex s because my current environment doesn t have Modernizr  but if it did  I would have used that to conditionally only show my data picker if the browser didn t support one already

User · Answer

If you are using Bootstrap date picker  then you can just add data date format attribute as below          Html TextBoxFor m   gt  m StartDate  new     id    your-id    class    datepicker form-control input-datepicker   placeholder    dd mm yyyy   data date format    dd mm yyyy

User · Answer

TL DR   Html TextBoxFor m   gt  m DOB  quot  0 yyyy-MM-dd  quot   new   type    quot date quot      Applying  DisplayFormat ApplyFormatInEditMode   true  DataFormatString    quot  0 yyyy-MM-dd  quot    didn t work out for me   Explanation  The date of an html input element of type date must be formatted in respect to ISO8601  which is  yyyy-MM-dd  The displayed date is formatted based on the locale of the user s browser  but the parsed value is always formatted yyyy-mm-dd   My experience is  that the language is not determined by the Accept-Language header  but by either the browser display language or OS system language  In order to display a date property of your model using Html TextBoxFor   Date property of your model class  public DateTime DOB   get  set     Nothing else is needed on the model side   In Razor you do   Html TextBoxFor m   gt  m DOB  quot  0 yyyy-MM-dd  quot   new   type    quot date quot

User · Answer

datimetime displays in the datePicker is 11 24 2011 12 00 00 AM     you could split this by space and set the value to date only  Script       if      StartDate   val                    var arrDate       StartDate   val   split                   StartDate   val arrDate 0            Markup        lt div class  editor-field  gt           Html LabelFor model   gt  model StartDate   Start Date            Html TextBoxFor model   gt  model StartDate  new    class    date-picker-needed          lt  div gt    Hopes this helps

User · Answer

This worked for me    Html TextBoxFor m   gt  m DateOfBirth    0 MM dd yyyy    new   size    12    class    DOB   tabindex   121

User · Answer

Or use the untyped helpers    lt    Html TextBox  StartDate   string Format   0 d    Model StartDate     gt

User · Answer

For me   I needed to keep the TextboxFor   because using EditorFor   changes the input type to date   Which  in Chrome  adds a built in date picker  which screwed up the jQuery datepicker that I was already using   So  to continue using TextboxFor   AND only output the date  you can do this    lt tr gt       lt td class  Label  gt  Html LabelFor model   gt  model DeliveryDate  lt  td gt                 string deliveryDate   Model DeliveryDate ToShortDateString               lt td gt  Html TextBoxFor model   gt  model DeliveryDate  new    Value   deliveryDate      lt  td gt       lt td style  color  red   gt  Html ValidationMessageFor model   gt  model DeliveryDate  lt  td gt   lt  tr gt

User · Answer

You can use below code to print time in HH mm format  In my case Property type is TimeSpan So the value is coming in HH mm tt format but I have to show in above format ie  HH mm     So you can use this code     Html TextBoxFor x   gt x mTimeFrom  null  new   Value  Model mTimeFrom ToString   Substring 0 5    class    form-control success

[asp.net-mvc] Date only from TextBoxFor()

Examples related to asp.net-mvc