203

モデルで DataType.Date 属性を使用し、ビューで EditorFor を使用しています。これはInternet Explorer 8とInternet Explorer 9では問題なく動作しますが、Google Chromeでは日付ピッカーが表示され、値が表示される代わりに、「月/日/年」が薄い灰色のテキストで表示されます。

Google Chrome で値が表示されないのはなぜですか?

モデル：

[DataType(DataType.Date)]
public Nullable<System.DateTime> EstPurchaseDate { get; set; }

意見：

<td class="fieldLabel">Est. Pur. Date</td>
<td class="field">@Html.EditorFor(m=>m.EstPurchaseDate)</td>

クロム

インターネットエクスプローラ

4

8 に答える 8

389

[DataType(DataType.Date)]ASP.NET MVC 4 で既定のテンプレートを使用してモデル プロパティを装飾すると、次の入力フィールドが生成されtype="date"ます。

<input class="text-box single-line" 
       data-val="true" 
       data-val-date="The field EstPurchaseDate must be a date."
       id="EstPurchaseDate" 
       name="EstPurchaseDate" 
       type="date" value="9/28/2012" />

Google Chrome などの HTML5 をサポートするブラウザーは、この入力フィールドを日付ピッカーでレンダリングします。

日付を正しく表示するには、値を次のようにフォーマットする必要があります2012-09-28。仕様書より引用：

値: [RFC 3339] で定義されている有効な完全な日付で、年コンポーネントが 0 より大きい数値を表す 4 桁以上であるという追加の資格があります。

DisplayFormat次の属性を使用して、この形式を適用できます。

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
public Nullable<System.DateTime> EstPurchaseDate { get; set; }
于 2012-09-28T06:06:51.770 に答える
45

MVC5.2 では、Date.cshtml をフォルダー ~/Views/Shared/EditorTemplates に追加します。

@model DateTime?
@{
    IDictionary<string, object> htmlAttributes;
    object objAttributes;
    if (ViewData.TryGetValue("htmlAttributes", out objAttributes))
    {
        htmlAttributes = objAttributes as IDictionary<string, object> ?? HtmlHelper.AnonymousObjectToHtmlAttributes(objAttributes);
    }
    else
    {
        htmlAttributes = new RouteValueDictionary();
    }
    htmlAttributes.Add("type", "date");
    String format = (Request.UserAgent != null && Request.UserAgent.Contains("Chrome")) ? "{0:yyyy-MM-dd}" : "{0:d}";
    @Html.TextBox("", Model, format, htmlAttributes)
}
于 2014-11-13T22:00:15.587 に答える
18

ダリン・ディミトロフの答えへの追加として：

この特定の行で特定の (標準とは異なる) 形式のみを使用する場合は、MVC5 で使用できます。

@Html.EditorFor(model => model.Property, new {htmlAttributes = new {@Value = @Model.Property.ToString("yyyy-MM-dd"), @class = "customclass" } })
于 2014-12-19T12:47:51.047 に答える
11

MVC 3 では、次を追加する必要がありました。

using System.ComponentModel.DataAnnotations;

プロパティを追加するときの使用の中で：

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]

特に、私のようにこれらのプロパティを .edmx ファイルに追加している場合。デフォルトでは .edmx ファイルにはこれが使用されていないため、プロパティを追加するだけでは不十分であることがわかりました。

于 2013-01-03T11:46:22.837 に答える
10

モデルから削除する[DataType(DataType.Date)]と、Chrome の入力フィールドはとしてレンダリングされtype="datetime"、datepicker も表示されません。

于 2012-10-04T10:55:32.097 に答える
4

yyyy-MM-dd の形式を渡すという問題がまだありましたが、Date.cshtml を変更することで回避しました。

@model DateTime?

@{
    string date = string.Empty;
    if (Model != null)
    {
        date = string.Format("{0}-{1}-{2}", Model.Value.Year, Model.Value.Month, Model.Value.Day);
    }

    @Html.TextBox(string.Empty, date, new { @class = "datefield", type = "date"  })
}
于 2012-11-29T13:09:30.160 に答える
3

MVC4 DataType.Date EditorForへの返信は、Chrome では日付値を表示しませんが、IE では問題ありません

モデルでは、次のタイプの宣言が必要です。

[DataType(DataType.Date)]
public DateTime? DateXYZ { get; set; }

また

[DataType(DataType.Date)]
public Nullable<System.DateTime> DateXYZ { get; set; }

次の属性を使用する必要はありません。

[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]

Date.cshtml で、次のテンプレートを使用します。

@model Nullable<DateTime>
@using System.Globalization;

@{
    DateTime dt = DateTime.Now;
    if (Model != null)
    {
        dt = (System.DateTime)Model;

    }

    if (Request.Browser.Type.ToUpper().Contains("IE") || Request.Browser.Type.Contains("InternetExplorer"))
    {
        @Html.TextBox("", String.Format("{0:d}", dt.ToShortDateString()), new { @class = "datefield", type = "date" })
    }
    else
    {
        //Tested in chrome
        DateTimeFormatInfo dtfi = CultureInfo.CreateSpecificCulture("en-US").DateTimeFormat;
        dtfi.DateSeparator = "-";
        dtfi.ShortDatePattern = @"yyyy/MM/dd"; 
        @Html.TextBox("", String.Format("{0:d}", dt.ToString("d", dtfi)), new { @class = "datefield", type = "date" })
    } 
}

楽しむ！よろしく、ブレトン

于 2013-12-31T13:32:04.953 に答える
2

日付の形式を制御する必要がある場合 (つまり、yyyy-mm-dd 形式だけが受け入れられるわけではありません)、別の解決策として、文字列型のヘルパー プロパティを追加し、そのプロパティに日付バリデータを追加することができます。 、UI でこのプロパティにバインドします。

    [Display(Name = "Due date")]
    [Required]
    [AllowHtml]
    [DateValidation]
    public string DueDateString { get; set; }

    public DateTime? DueDate 
    {
        get
        {
            return string.IsNullOrEmpty(DueDateString) ? (DateTime?)null : DateTime.Parse(DueDateString);
        }
        set
        {
            DueDateString = value == null ? null : value.Value.ToString("d");
        }
    }

そして、ここに日付バリデータがあります：

[AttributeUsage(AttributeTargets.Property, AllowMultiple = true, Inherited = true)]
public class DateValidationAttribute : ValidationAttribute
{
    public DateValidationAttribute()
    {
    }

    protected override ValidationResult IsValid(object value, ValidationContext validationContext)
    {
        if (value != null)
        {
            DateTime date;

            if (value is string)
            {
                if (!DateTime.TryParse((string)value, out date))
                {
                    return new ValidationResult(validationContext.DisplayName + " must be a valid date.");
                }
            }
            else
                date = (DateTime)value;

            if (date < new DateTime(1900, 1, 1) || date > new DateTime(3000, 12, 31))
            {
                return new ValidationResult(validationContext.DisplayName + " must be a valid date.");
            }
        }
        return null;
    }
}
于 2015-01-12T13:59:55.717 に答える