1

在我的视图模型中,我设置了一个具有此属性的字段。

如果用户以正确的格式输入日期和时间,一切正常。

如果用户没有以正确的格式插入日期时间,则会出现错误。

我也想在客户端进行验证。

你能告诉我怎么做吗?

   [Required]
    [Display(Name = "Start DateTime")]
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:MM/dd/yyyy HH:mm}")]
    public System.DateTime DateTimeStart { get; set; }
4

2 回答 2

3

从类型的属性中获取格式异常DateTime是非常烦人的问题。在DateTime.

DataAnnotaions在服务器端工作并充分利用它们,您需要ModelState.IsValid()在控制器中添加。

public ActionResult Index(MyViewModel model)
{
    if(ModelState.IsValid())
    {
       // valid data received...
    }
    else
    {
       // Invalid data, add model error here and return view...
    }
}

如果您要在客户端进行这些工作,那么您需要JavaScript在代码中包含两个附加文件,即jquery.validate.js与核心库jquery.validate.unobtrusive.js一起。jQuery默认情况下,所有这些文件都在基本 MVC 项目中并包含在Layout.

请务必注意包含这些文件的顺序。jQuery核心应始终位于顶部,然后是验证库。

  • jQuery.js
  • jquery.validate.js
  • jquery.validate.unobtrusive.js

web.config确保在MVC 项目的文件中打开了验证标志。转到此文件并找到以下内容并设置它们( true如果它们为假)。

<appSettings>
  <add key="ClientValidationEnabled" value="true"/> 
  <add key="UnobtrusiveJavaScriptEnabled" value="true"/> 
</appSettings>

这应该将您的验证设置为在客户端工作。您可以使用RegularExpression装饰模型属性。

 [Required]
 [RegularExpression("^(([0-2]?[0-9]|3[0-1])/([0]?[1-9]|1[0-2])/[1-2]\d{3}) (20|21|22|23|[0-1]?\d{1}):([0-5]?\d{1})$", ErrorMessage = "Invalid date")]
 public string DateTimeStart { get; set; }

这将验证datetimeindd-mm-yyyy hh:mm格式。

此外,在这种情况下,您还可以将属性设为string类型,因为正则表达式会处理您的日期格式。

除此之外,您还可以创建自定义 DataAnnotation。

于 2013-01-23T09:17:10.403 回答
1

首先,您使用什么来允许用户输入日期?

如果您使用的是Jquery DatePicker,那么请参阅此示例,用户无法以错误的格式输入日期(除了检查元素和更改文本框值,可以忽略。)

使用 Jquery Datepicker 的示例代码:

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
  <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
  $(function() {
    $( "#datepicker" ).datepicker();
  });
  </script>
</head>
<body>

<p>Date: <input type="text" id="datepicker" /></p>


</body>
</html>

如果您不使用 DatePicker,我强烈建议您使用它。

如果您是 datepicker 的新手,您可以阅读以下列出的文章以开始使用:

于 2013-01-23T09:10:39.247 回答