2014-09-23 50 views
1

若要了解Google Chrome和支持HTML5日期其他瀏覽器本身來顯示日期選擇我需要把這些屬性在模型中的日期屬性:跨瀏覽器的日期選擇器格式

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

對於其他瀏覽器,我使用jQuery UI中的datepicker。

我已經設置datepicker使用dd.MM.yyyy格式,dd.MM.yyyy。

只要用戶點擊該字段並選擇日期 ,但當服務器端的字段中有數據時,它將以yyyy-MM-dd格式顯示,並且未被選爲日期選擇器打開時的默認值。

當它必須從服務器以yyyy-MM-dd格式發送時,如何以dd.MM.yyyy格式顯示日期,以便與原生html5 datepicker一起使用?

<!DOCTYPE html> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
<head> 
 
    <title></title> 
 
    <link href="Content/themes/base/jquery-ui.css" rel="stylesheet" /> 
 
    <script src="Scripts/jquery-1.10.2.js"></script> 
 
    <script src="Scripts/modernizr-2.6.2.js"></script> 
 
    <script src="Scripts/jquery-ui-1.10.2.js"></script> 
 
    <script src="Scripts/jquery-ui-i18n.js"></script> 
 
    <script type="text/javascript"> 
 
     $(document).ready(function() { 
 

 
      if (!Modernizr.inputtypes.date) { 
 
       $.datepicker.setDefaults(
 
        $.extend(
 
        { 
 
         'dateFormat': 'mm.dd.yy', 
 
         'altFormat': 'yy-mm-dd' 
 
        }, 
 
        $.datepicker.regional['no'] 
 
        ) 
 
        );    
 
       $("#From").datepicker().val(); 
 
       $("#To").datepicker(); 
 
      } 
 
     }) 
 
    </script> 
 
</head> 
 
<body> 
 
    <form action="/Home/Date" method="post">   
 
     <label for="From">From: </label> 
 
     <input id="From" name="From" type="date" value="2014-09-23" /> 
 
     <label for="To">To: </label> 
 
     <input id="To" name="To" type="date" value="2014-10-09" />   
 
     <input type="submit" value="Save" class="btn btn-default" /> 
 
    </form> 
 
</body> 
 
</html>

在Chrome使用本地日期選擇器和格式化的時間,根據鉻合金設置。

Chrome

在Firefox它呈現這樣的:

Firefox

你已經點擊了現場後,並選擇它使用我想要的格式的日期,DD.MM.YYYY

有沒有辦法強制jQuery datepicker在頁面加載時格式化包含的數據?

+0

試試這招:創建另一個隱藏的日期選擇器與格式'YYYY-MM -dd'。當你讀取/發送數據時,只需使用'getDate&setDate'同步兩個datepicker。 – Fancyoung 2014-09-23 08:55:27

+0

爲什麼不在jQuery datepicker中設置日期格式?那麼服務器和客戶端都使用相同的格式? – Jamie 2014-09-23 09:11:17

+0

我確實在datepicker中設置了日期格式,一旦用戶實際點擊了日期選擇器,一切都可以正常工作。 問題是它在用戶單擊日期字段之前顯示的格式不正確。 – 2014-09-23 10:46:12

回答

0

可以改變目前文化在Global.asax文件,應用水平,例如,你可以嘗試你想要的任何格式,

using System.Globalization; 
using System.Threading; 

protected void Application_BeginRequest(Object sender, EventArgs e) 
{  
    CultureInfo newCulture = (CultureInfo) System.Threading.Thread.CurrentThread.CurrentCulture.Clone(); 
    newCulture.DateTimeFormat.ShortDatePattern = "dd-MMM-yyyy"; 
    newCulture.DateTimeFormat.DateSeparator = "-"; 
    Thread.CurrentThread.CurrentCulture = newCulture; 
}