2016-05-27 350 views
-2

我是MVC中的新成員。我有一個日期時間屬性和dataannotaion如下:MVC 5顯示日期時間格式

 [ReadOnly(true)] 
     [DataType(DataType.DateTime), DisplayFormat(ApplyFormatInEditMode = true, ConvertEmptyStringToNull = true, DataFormatString = "{0: dd/MMM/yyyy HH:mm:ss}", HtmlEncode = true, NullDisplayText = "-")] 
     [DisplayName("Last Update")]   
     [Required(AllowEmptyStrings = false, ErrorMessage = "Last Update is required.")] 
     public DateTime LastUpdate { get; set; } 

當在創建頁面顯示良好。但是當我提交時,我得到了驗證錯誤消息「最後更新字段必須是日期」,並且數據無法處理。然後我必須改變輸入格式爲「yyyy/MM/dd」,無需提交。

我正在使用@ Html.EditorFor()。如何使用EditorFor()在創建頁面中顯示日期格式(dd/MMM/yyyy),並在索引頁面中顯示日期時間格式(dd/MMM/yyyy HH:mm:ss)?或者如何通過驗證時編輯值日期時間格式如(dd/MMM/yyyy HH:mm:ss)?

+0

可以使用'@ Html.TextBoxFor(M => m.LastUpdate, 「{0:DD/MM/YYYY}」)'。還請注意,您的大多數屬性不是必需的。刪除'[DataType(DataType.DateTime)','ApplyFormatInEditMode = true','ConvertEmptyStringToNull = true'和'NullDisplayText =「 - 」'。如果您確實需要瀏覽器的HTML-5編輯器,那麼它需要是「@ Html.TextBoxFor(m => m.LastUpdate,」{0:yyyy-MM-dd}「,new {type =」date「} )'但它僅在Chrome和Edge中受到支持 –

回答

0

這是更好地使用文本框來獲取所需的functionality.This是我done.Check如果它可能是有幫助的方式:

型號:

[DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}", ApplyFormatInEditMode = true)] 
    [MyDate(ErrorMessage = "Date Of Birth cannot be greater than Today")] 
    [Required(ErrorMessage = "Date Of Birth Required")] 
    public DateTime? EndDate { get; set; } 

查看:

 @Html.ValidationMessageFor(m => m.EndDate, "*") 
     @Html.LabelFor(m => m.EndDate, "Date :", new { style = "display:inline;" }) 
     @Html.TextBoxFor(m => m.EndDate, "{0:MM/dd/yyyy}",new { id = "datepicker"}) 

在查看"{0:MM/dd/yyyy}"用於正確的格式設置爲日期

我已經使用Jquery的日期選擇器和代碼如下:

<script> 
    $(document).ready(function() { 
    $("#datepicker").datepicker({ 
     //dateFormat: "yy-mm-dd",(to display date in required format) 
     changeYear: true, 
     changeMonth: true, 
     yearRange: '1900:2222', 
     background: '#000', 
     showOn: "button" 
    }).css("display", "inline-block") 
      .next("button").button({ 
      icons: { primary: "ui-icon-calendar" }, 
      label: "cal", 
      text: false 
      }); 
    }); 
</script>