0

問題: globalize を使用して日付をドイツ語形式で表示したい。MVc 5で言及されている解決策- unobtrusiv js を使用したドイツ語の日付の検証 - IE と Firefox で動作する簡単なアプローチ - 問題ありません。

しかし、Google-Chrome は入力タイプの「日付」を使用し、日付ピッカーを表示します。検証は失敗しました。

4

2 に答える 2

0

ここstackoverflowで多くの回答を読んだ後、私はこの解決策にたどり着きました：

モデルでは、マップされていない新しいプロパティを導入します。

...
    [NotMapped]
    [DataType(DataType.Date)]
    [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
    public DateTime GeburtsdatumChromeEdit
    {
        get { return this.Geburtsdatum; }
        set { this.Geburtsdatum = value; }
    }
...

これは、Chrome が必要とする形式で dataannotation を追加するために必要DisplayFormatです。値を元のプロパティにパイプします。

ビューで、日付の入力を 2 倍にし、特別なクラスを持つ div で 2 つのグループをカプセル化しました。

<div class="date4Normal">
        @*Tut nicht in Chrome, da dieser dann einen Input vom Type "Date" verwendet und dieser verlangt dann ein Normdatum yyyy-mm-dd*@
        @Html.EditorFor(model => model.Geburtsdatum)
        @Html.ValidationMessageFor(m => m.Geburtsdatum, String.Empty, new {@class = "text-danger"})
    </div>
    <div class="date4Chrome">
        @Html.EditorFor(model => model.GeburtsdatumChromeEdit)
        @Html.ValidationMessageFor(m => m.GeburtsdatumChromeEdit, String.Empty, new { @class = "text-danger" })
        @*@Html.TextBoxFor(model => model.Geburtsdatum, "{0:dd.MM.yyyy}")
        @Html.ValidationMessageFor(m => m.Geburtsdatum, String.Empty, new { @class = "text-danger" })*@
    </div>

stackoverflow で見つけた関数 (ブラウザが <input type='date'> をサポートしているかどうかを確認するにはどうすればよいですか) を使用すると、実際のブラウザが日付入力を使用しているかどうかを検出できます。

 function checkDateInput() {
        var input = document.createElement('input');
        input.setAttribute('type', 'date');

        var notADateValue = 'not-a-date';
        input.setAttribute('value', notADateValue);

        return (input.value !== notADateValue);
    }

次の関数で、不要な入力ブロックを削除します。

 function switchForChrome() {
        var isChrome = checkDateInput();
        if (isChrome) {
            $('.date4Normal').remove();
        } else {
            $('.date4Chrome').remove();
        }
    };

$(document).ready関数では、switchForChrome();.

この時点では機能しているように見えますが、日付の検証は常に失敗しました。

したがって、回避するコードをいくつか追加します ( ASP.NET MVC 4 は、datetime の data-val-date の生成を回避します)。

if (checkDateInput()) {
    $.validator.addMethod('date',
        function (value, element) {
            return true;
     });
}

そして最後にそれは機能します。表示には元のプロパティ ( Geburtsdatum) を使用するため、言語固有の形式を取得し、編集には元のプロパティ (IE、Firefox) または新しいプロパティGeburtsdatumChromeEdit(Chrome、Opera) を使用します。

于 2017-07-06T09:43:01.580 に答える