如何在 Asp.Net MVC 中捕获月/年？答案

【问题标题】：How can capture Month/Year in an Asp.Net MVC?如何在 Asp.Net MVC 中捕获月/年？
【发布时间】：2023-03-16 02:06:01
【问题描述】：

我必须使用以下格式MM/yyyy 捕获DateTime。我的视图模型看起来像这样

public class SomeViewModel
{
    public string Name { get; set; }

    [DataType(DataType.Date), DisplayFormat(DataFormatString = "{0:MM/yyyy}", ApplyFormatInEditMode = true)]
    public DateTime? TargetMonth { get; set; }
}

然后我有名为Date.cshtml 的剃须刀编辑器模板，代码如下

@model DateTime?
@Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { @class = "form-control", placeholder = ViewData.ModelMetadata.Watermark })

当我像 07/2018 这样选择/键入值时，我在客户端验证期间收到以下错误

目标月份字段必须是日期。

如何使用MM/yyyy 格式正确捕获月份？

【问题讨论】：

将其设为月份（1 到 12）的下拉菜单，并将年份设为数字字段。我认为这是一个更好的 UI 设计。您也可以限制年份的最小值和最大值。如果您想要单个输入，请使用带掩码的输入框并制作属性字符串。或者制作属性字符串并将正则表达式应用于它以进行验证。

标签： c# asp.net-mvc razor

【解决方案1】：

我已在示例项目中复制了您的问题。问题在于 TextBox 帮助程序 (source) 中忽略了 DisplayFormat 属性。

我建议使用现有的 datepicker 库，有很多好的解决方案可供选择。我找到了一个 JS Fiddle using Bootstrap Datepicker 来满足您的月份选择器要求。

HTML：

<input type="text" class="monthPicker" placeholder="CheckIn" >

JS：

$('.monthPicker').datepicker({
    autoclose: true,
    minViewMode: 1,
    format: 'mm/yyyy'
})

您可以更改您的编辑器模板以使用此日期选择器。

【讨论】：

问题不在于如何显示选择器。关于如何将值正确绑定到视图模型的问题。我已经在使用引导选择器，但这只是为用户提供一种简单的选择日期的方法。
问题是客户端验证不起作用。我指出这是由于 DisplayFormat 被忽略并为客户端验证提供了替代方案。
也许我还应该指出 DataType.Date 客户端验证是导致您看到的客户端错误的原因（“字段目标月份必须是日期”）。

【解决方案2】：

您会希望视图模型上的“TargetMonth”属性是字符串，而不是日期。验证字符串以匹配此正则表达式： '[0-1]?[1-9]/[1-2][0-9]{3}'

然后向您的数据模型添加一个 get only 属性来解析字符串并返回一个 DateTime 实例，或者在您将值传递给其对应的实体对象进行存储时执行转换逻辑。

【讨论】：