51

ASP.Net MVC アプリケーションを MVC-4 にアップグレードしました。DateTime 値に基づく入力用のフィールド エディターに、HTML-5type="date"属性/値宣言が含まれるようになりました。

これで、Chrome で表示すると、日付入力が入力フィールドに「mm/dd/yyyy」と表示されます。

ボックスに「mm/dd/yyyy」が含まれる日付フィールド

value 属性を使用して正しい形式の日付を渡した場合でも、次のようになります。

<input value="2012/10/02" type="date"/>

ユーザーが手動で値を変更するまで、入力ボックスに「mm/dd/yyyy」が表示されます。

問題は Chrome にあるようで、バックエンド フレームワークとは無関係です。実際にこの問題を参照してください: jsFiddle

...もちろん、レコードの編集には大きな問題です。ユーザーが既に有効な日付を持つレコードを取得した場合、フィールドをクリックして値を手動でリセットしない限り、送信時に検証に合格しません。

他のブラウザでは問題ありません。

これはChromeのバグですか?それとも、HTML-5 の日付フィールドが機能するはずの方法を見逃したことがありますか?

更新
この修正フィドルを参照してください: http://jsfiddle.net/HudMe/5/ HTML-4 と HTML-5 の両方の日付入力があり、それぞれ「10/01/2012」がページ読み込みの値として設定されています.

いずれかの日付フィールドをクリックします。Javascript は、その要素のフィールドの値でアラートを表示する必要があります。

有効な日付が value 属性で渡されているため、「10/01/2012」と表示されるはずですが、Chrome では HTML-5 日付フィールドには何も表示されません。この値を手動でリセットしてからもう一度クリックすると、表示されるようになります。

HTML5 フィールドの値は、Safari、Firefox、IE、および Opera でのページ読み込み後に調整なしで期待どおりに表示され、アラートが表示されます。

受け入れられた回答に関する注意:
Asp.net mvc-4 の他のユーザーの場合[DisplayFormat]、view-model の DateTime フィールド宣言の属性を使用して表示形式を調整できます。( https://stackoverflow.com/a/12634470/613004にあります)

4

5 に答える 5

59

これが機能したため、クロムで値を設定する必要があると思いますYYYY-MM-DDhttp://jsfiddle.net/HudMe/6/

したがって、機能させるには、日付を次のように設定する必要があります2012-10-01

于 2013-02-01T14:15:19.833 に答える
3

同じ問題がありました。同僚がこれをjQuery.Globalizeで解決しました。

<script src="/Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="/Scripts/jquery.globalize/globalize.js" type="text/javascript"></script>
<script src="/Scripts/jquery.globalize/cultures/globalize.culture.nl.js"></script>
<script type="text/javascript">
    var lang = 'nl';

    $(function () {
        Globalize.culture(lang);
    });

    // fixing a weird validation issue with dates (nl date notation) and Google Chrome
    $.validator.methods.date = function(value, element) {
        var d = Globalize.parseDate(value);
        return this.optional(element) || !/Invalid|NaN/.test(d);
    };
</script>

日付の選択に jQuery Datepicker を使用しています。

于 2013-02-01T14:11:24.760 に答える
1

私は 2016-08-8 のような値で同じ問題を抱えていましたが、ゼロを追加して 2 桁の日付にすることを解決しましたが、うまくいきました。Chrome、Firefox、Edge でテスト済み

today:function(){
   var today = new Date();
   var d = (today.getDate() < 10 ? '0' : '' )+ today.getDate();
   var m = ((today.getMonth() + 1) < 10 ? '0' :'') + (today.getMonth() + 1);
   var y = today.getFullYear();
   var x = String(y+"-"+m+"-"+d); 
   return x;
}
于 2016-08-08T14:21:36.187 に答える