仅来自TextBoxFor()的日期


271

我无法使用TextBoxFor <,>(表达式,htmlAttributes)将DateTime的唯一日期部分显示到文本框中。

该模型基于Linq2SQL,字段是SQL和Entity模型中的DateTime。

失败:

<%= Html.TextBoxFor(model => model.dtArrivalDate, String.Format("{0:dd/MM/yyyy}", Model.dtArrivalDate))%>

这个技巧似乎已被淘汰,对象htmlAttribute中的任何字符串值都将被忽略。

失败:

[DisplayFormat( DataFormatString = "{0:dd/MM/yyyy}" )]
public string dtArrivalDate { get; set; }

我想只在细节/编辑视图中存储和显示日期部分,而没有“ 00:00:00”部分。

Answers:


237
[DisplayName("Start Date")]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
public DateTime StartDate { get; set; }

然后:

<%=Html.EditorFor(m => m.StartDate) %>

是的,因为现在有了EditorForHelper,并且MVC2已完成,所以您的解决方案是必行之路
Kronos 2010年

66
但是现在无法将Jquery UI datepicker应用于此输入,因为它忽略了Html.EditorFor()助手指定的@ class =“ datepicker”属性。因此,此文本框现在可以正确设置格式,但是在单击时不会启动日期选择器。因此,它固定了一件事,却弄坏了另一件事。
亚伦

5
我如何使其显示与此解决方案一致,但又如何像使用Html.TextboxFor()一样启动
Aaron

49
我正在使用MVC4 Razor语法,将日期字段呈现为,@Html.EditorFor(m => m.IssueDate)并应用了模型上的格式,[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}" )]但日期仍显示为01/01/0001 12:00:00 AM
bjan 2012年

4
@Aaron没有带有htmlAttributes参数的EditorFor的重载。您可能会将其传递给viewTemplate参数或其他东西,以为您传递的是htmlAttributes。这是Editorfor的缺点。TextBoxFor忽略DisplayFormat批注。Alexeyss的解决方案采用了不同的格式来解决此问题。
AaronLS 2012年

362

MVC4通过添加一个新的TextBoxFor重载来解决此问题,该重载采用字符串格式参数。现在,您可以简单地执行以下操作:

@Html.TextBoxFor(m => m.EndDate, "{0:d MMM yyyy}")

还有一个带有html属性的重载,因此您可以设置CSS类,连接日期选择器等:

@Html.TextBoxFor(m => m.EndDate, "{0:d MMM yyyy}", new { @class="input-large" })

40
这是MVC4的最佳答案-它使我可以使用jquery UI datepicker并格式化执行以下操作的选择:@Html.TextBoxFor(m => m.SomeDate, "{0:MM/dd/yyyy}", new { @id="datepicker" })
ericb 2013年

3
谢谢!但是,似乎TextBoxFor忽略了模型的[DisplayFormat]属性是一个错误。很高兴在TextBoxFor中至少有一个覆盖(并且您提醒我注意)。
尼尔·拉斯莱特,2013年

7
我是这样设置的,@Html.TextBoxFor(model => model.CDate, "{0:dd.MM.yyyy}")但是在httpPost上我得到的数据是MM.dd.yyyy。如何解决呢?
user007 2014年

3
我给你买啤酒!这个小问题让我头疼不已,直到找到答案。
JoshYates1980

3
仅供参考许多浏览器input[type=date]规范都要求使用"{0:yyyy-MM-dd}"格式。
KyleMit

259
<%= Html.TextBoxFor(model => model.EndDate, new { @class = "jquery_datepicker", @Value = Model.EndDate.ToString("dd.MM.yyyy") })%>

5
除了需要覆盖其他HTML属性(例如id或class)外,EditorFor解决方案均有效。这是一个很好的解决方案。奇怪的是V需要大写。
本·米尔斯

1
为了安全地处理null,可以执行Model.EndDate.GetValueOrDefault()。ToString(“ dd.MM.yyyy”)。如果Model.EndDate为null,则将显示Datetime的默认值。

15
关于空值,DateTime的默认值为1901年1月1日,我认为最好使用@Value = (Model.DateBecamePermanentResident == null ? "" : Model.DateBecamePermanentResident.Value.ToString("dd.MM.yyyy"))
Serj Sagan

1
@Spikolynn,这并没有为我生成第二个“值”属性(MVC3 /剃刀模板)。
Doug S

2
罪魁祸首:在“值”中检查大写的“ V”,小写字母不会!
Tejasvi Hegde 2014年

48

或使用无类型的帮助器:

<%= Html.TextBox("StartDate", string.Format("{0:d}", Model.StartDate)) %>

22
轻微变化@Html.TextBoxFor(model => model.EndDate, "{0:d}", new { type = "date" })
Dan Friedman

它确实使用Razor代替ASPX视图引擎,但是它们都在MVC 4中工作,并且从一种语法更改为另一种语法是微不足道的。我在Razor上发布的原因是我使用和测试过的。就像我说的,这是一种变化。
丹·弗里德曼

1
@丹·弗里德曼:这就是我要走的路!我曾经使用过一个编辑器模板,但是后来我还必须创建自己的html,并包括所有验证消息和所有Bootstrap属性,因此这对我来说是真正的方法(asp.net mvc5)
Michel

1
您能创造一个新的问题并详细说明您所做的事情吗?给我加上标签,我将很乐意为您提供帮助。
丹·弗里德曼

1
当您需要全球化时,此解决方案是最好的。
alansiqueira27 2015年

26

这对我有用。

@Html.TextBoxFor(m => m.DateOfBirth, "{0:MM/dd/yyyy}", new { size = "12", @class = "DOB", tabindex = 121 })

12

不要害怕使用原始HTML。

<input type="text" value="<%= Html.Encode(Model.SomeDate.ToShortDateString()) %>" />

4
那他怎么回贴呢?因为日期几乎几乎肯定不会在服务器上解析。
罗伯特·科里特尼克

10
只要您包含正确的“ name =“ StartDate””,模型联编程序便会选择它。
naspinski 2011年

@DrJokepu是MVC3上唯一对我有用的东西。那是我无论如何都无法制作TextBoxForEditorFor格式化值。看到我的问题:TextBoxFor助手将日期和月份混合在日期中
horgh 2013年

10

TL; DR;

@Html.TextBoxFor(m => m.DOB,"{0:yyyy-MM-dd}", new { type = "date")

正在申请 [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]对我没有效果!


说明:

为了显示模型的日期属性,请使用Html.TextBoxFor

在此处输入图片说明

您的模型类的Date属性:

public DateTime DOB { get; set; }

在模型方面,不需要任何其他操作。


在剃刀中,您可以:

@Html.TextBoxFor(m => m.DOB,"{0:yyyy-MM-dd}", new { type = "date")


说明:

input类型的html 元素的日期date必须相对于ISO8601进行格式化,即:yyyy-MM-dd

显示的日期是根据用户浏览器的语言环境设置的格式,但解析后的值始终设置为yyyy-mm-dd。

我的经验是,语言不是由Accept-Language标题决定的,而是由浏览器显示语言或OS系统语言决定的。


4

您还可以通过应用以下数据注释来使用HTML 5属性:

[DataType(DataType.Date)]

但是问题在于,这为HTML 5浏览器启用了浏览器特定的日期选择器。对于仍然不支持的浏览器,您仍然需要自己的日期选择器,然后必须确保除浏览器之外没有显示日期选择器(Modernizr可以轻松地做到这一点),或者隐藏浏览器的日期选择器(很复杂,我不知道我看到的方法有多可靠)。

最后,我选择了Alex,因为我当前的环境中没有Modernizr,但如果有的话,我会用它来有条件地仅在浏览器不支持数据选择器时显示我的数据选择器。


3

对我来说,我需要保留,TextboxFor()因为使用EditorFor()会将输入类型更改为最新的日期。在Chrome中,它添加了一个内置的日期选择器,从而弄乱了我已经在使用的jQuery datepicker。因此,要继续使用TextboxFor()AND仅输出日期,您可以执行以下操作:

<tr>
    <td class="Label">@Html.LabelFor(model => model.DeliveryDate)</td>
    @{
        string deliveryDate = Model.DeliveryDate.ToShortDateString();
    }
    <td>@Html.TextBoxFor(model => model.DeliveryDate, new { @Value = deliveryDate }) *</td>
    <td style="color: red;">@Html.ValidationMessageFor(model => model.DeliveryDate)</td>
</tr>

1

初始加载时,DisplayFormat属性对我都不起作用。我改为创建一个EditorTemplate:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.DateTime>" %>
<%@ Import Namespace="System.Web.Mvc.Html" %>
<%=
    Html.TextBox("", Model.ToShortDateString(), new { @class = "date-range" }) %>

1

模板编辑器仅可用于显示目的。如果您使用相同的编辑器(之所以有意义是因为它是一个编辑器),并且您提供的值类似于31/01/2010-您会收到一条错误消息,指出格式无效。


1

我使用Globalize,因此使用许多日期格式,因此请使用以下命令:

@Html.TextBoxFor(m => m.DateOfBirth, "{0:d}")

这将自动将日期格式调整为浏览器的区域设置。


1

请记住,展示取决于文化。而且在大多数情况下,所有其他答案都是正确的,但对我却不起作用。如果附加了文化问题,jQuery datepicker也将引起不同的问题。

如果您希望/通过以下方式强制格式转义:

@Html.TextBoxFor(model => model.dtArrivalDate, "{0:MM\\/dd\\/yyyy}")

如果我不逃避的话,那将显示出08-01-2010与预期的对比08/01/2010

另外,如果不进行转义,jQuery datepicker将选择其他defaultDate,在我的实例中为May 10, 2012


1

如果使用的是Bootstrap日期选择器,则只需添加data_date_format属性,如下所示。

      @Html.TextBoxFor(m => m.StartDate, new { 
@id = "your-id", @class = "datepicker form-control input-datepicker", placeholder = "dd/mm/yyyy", data_date_format = "dd/mm/yyyy" 
})

0

// datime在datePicker中显示为11/24/2011 12:00:00 AM

//您可以按空格将其拆分,并将值设置为date

脚本:

    if ($("#StartDate").val() != '') {
        var arrDate = $('#StartDate').val().split(" ");
        $('#StartDate').val(arrDate[0]);
    }

标记:

    <div class="editor-field">
        @Html.LabelFor(model => model.StartDate, "Start Date")
        @Html.TextBoxFor(model => model.StartDate, new { @class = "date-picker-needed" })
    </div>

希望这会有所帮助..


7
您的解决方案应该可以工作。但以我的拙见,依靠客户端在服务器端发布的格式化字符串日期可能会很危险。如果服务器端的区域设置在日期和时间之间不包含空格,则公开的解决方案将失败。
Kronos

0

当然可以使用Html.EditorFor。但是,如果要使用TextBoxFor并使用DisplayFormat属性中的格式,则可以按以下方式使用它:

@Html.TextBoxFor(model => model.dtArrivalDate, ModelMetadata.FromLambdaExpression(model => model.dtArrivalDate, ViewData).EditFormatString)

或创建下一个扩展名:

public static class HtmlExtensions
{
    public static MvcHtmlString TextBoxWithFormatFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes)
    {
        return htmlHelper.TextBoxFor(expression, ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData).EditFormatString, htmlAttributes);
    }
}

0

只需在模型旁边添加即可。

[DataType(DataType.Date)]
public string dtArrivalDate { get; set; }

0

在ASP.NET Core中使用标记帮助器时,需要以ISO格式指定格式。如果未指定,则绑定的输入数据将无法正确显示,并且将显示为mm / dd / yyyy,没有任何值。

模型:

[Display(Name = "Hire")]
[DataType(DataType.Date)]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
public DateTime? HireDate { get; set; }

视图:

<input asp-for="Entity.HireDate" class="form-control" />

也可以使用asp-format属性在视图中指定格式。

生成的HTML将如下所示:

<input class="form-control" type="date" id="Entity_HireDate" 
    name="Entity.HireDate" value="2012-01-01">

0

您可以使用以下代码以HH:mm格式打印时间,在我的情况下,属性类型为TimeSpan, 因此值以HH:mm:tt格式显示,但我必须以上述格式显示。高度:毫米

因此,您可以使用以下代码:

@Html.TextBoxFor(x =>x.mTimeFrom, null, new {@Value =Model.mTimeFrom.ToString().Substring(0,5), @class = "form-control success" })

0

如果您坚持使用[DisplayFormat],但没有使用MVC4,则可以使用以下命令:

@Html.TextBoxFor(m => m.EndDate, new { Value = @Html.DisplayFor(m=>m.EndDate), @class="datepicker" })
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.