TextBoxFor（）からの日付のみ

TextBoxFor <、>（expression、htmlAttributes）を使用して、DateTimeの日付部分のみをテキストボックスに表示できません。

モデルはLinq2SQLに基づいており、フィールドはSQLおよびエンティティモデルのDateTimeです。

失敗：

<%= Html.TextBoxFor(model => model.dtArrivalDate, String.Format("{0:dd/MM/yyyy}", Model.dtArrivalDate))%>

このトリックは廃止されているようで、オブジェクトhtmlAttributeの文字列値は無視されます。

失敗：

[DisplayFormat( DataFormatString = "{0:dd/MM/yyyy}" )]
public string dtArrivalDate { get; set; }

「00:00:00」の部分はなく、詳細/編集ビューに日付の部分のみを保存して表示したいと思います。

[DisplayName("Start Date")]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
public DateTime StartDate { get; set; }

次に：

<%=Html.EditorFor(m => m.StartDate) %>

MVC4はTextBoxFor、文字列形式のパラメーターを受け取る新しいオーバーロードを追加することでこの問題を解決しました。あなたは今これを簡単に行うことができます：

@Html.TextBoxFor(m => m.EndDate, "{0:d MMM yyyy}")

html属性を取得するオーバーロードもあるので、CSSクラスを設定したり、日付ピッカーを接続したりできます。

@Html.TextBoxFor(m => m.EndDate, "{0:d MMM yyyy}", new { @class="input-large" })

<%= Html.TextBoxFor(model => model.EndDate, new { @class = "jquery_datepicker", @Value = Model.EndDate.ToString("dd.MM.yyyy") })%>

または、型なしヘルパーを使用します。

<%= Html.TextBox("StartDate", string.Format("{0:d}", Model.StartDate)) %>

これでうまくいきました。

@Html.TextBoxFor(m => m.DateOfBirth, "{0:MM/dd/yyyy}", new { size = "12", @class = "DOB", tabindex = 121 })

生のHTMLを使用することを恐れないでください。

<input type="text" value="<%= Html.Encode(Model.SomeDate.ToShortDateString()) %>" />

TL; DR;

@Html.TextBoxFor(m => m.DOB,"{0:yyyy-MM-dd}", new { type = "date")

申し込み[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]はうまくいきませんでした！

説明：

を使用してモデルの日付プロパティを表示するにはHtml.TextBoxFor：

モデルクラスの日付プロパティ：

public DateTime DOB { get; set; }

モデル側には他に何も必要ありません。

Razorでは、次のことを行います。

@Html.TextBoxFor(m => m.DOB,"{0:yyyy-MM-dd}", new { type = "date")

説明：

inputタイプのhtml 要素の日付は、ISO8601に従ってdateフォーマットされている必要があります。yyyy-MM-dd

表示される日付はユーザーのブラウザーのロケールに基づいてフォーマットされますが、解析された値は常にyyyy-mm-ddのフォーマットになります。

私の経験では、言語はAccept-Languageヘッダーではなく、ブラウザーの表示言語またはOSシステム言語のいずれかによって決定されます。

次のデータアノテーションを適用して、HTML 5属性を使用することもできます。

[DataType(DataType.Date)]

しかし問題は、これがHTML 5ブラウザーのブラウザー固有の日付ピッカーを有効にすることです。サポートされていないブラウザでも独自の日付ピッカーが必要であり、ブラウザに加えて日付ピッカーが表示されないことを確認する必要があります（Modernizrはこれを簡単に実行できます）。そうでない場合はブラウザを非表示にします（複雑で私が見た方法がどれほど信頼できるかわかりません）。

結局、現在の環境にはModernizrがないため、Alexを使用しましたが、もしそうであれば、ブラウザーがまだデータピッカーをサポートしていない場合にのみ、条件付きでデータピッカーを表示することになります。

私にとっては、TextboxFor()使用EditorFor()することで入力タイプが日付に変わるため、これを維持する必要がありました。Chromeでは、組み込みの日付ピッカーが追加されており、すでに使用していたjQueryの日付ピッカーが台無しになっています。したがって、引き続き使用しTextboxFor()て日付のみを出力するには、次のようにします。

<tr>
    <td class="Label">@Html.LabelFor(model => model.DeliveryDate)</td>
    @{
        string deliveryDate = Model.DeliveryDate.ToShortDateString();
    }
    <td>@Html.TextBoxFor(model => model.DeliveryDate, new { @Value = deliveryDate }) *</td>
    <td style="color: red;">@Html.ValidationMessageFor(model => model.DeliveryDate)</td>
</tr>

DisplayFormat属性は、初期ロード時にどちらの形式でも機能しませんでした。代わりにEditorTemplateを作成しました：

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.DateTime>" %>
<%@ Import Namespace="System.Web.Mvc.Html" %>
<%=
    Html.TextBox("", Model.ToShortDateString(), new { @class = "date-range" }) %>

テンプレートエディタは表示目的でのみ機能します。同じエディター（エディターであるため、理にかなっています）を使用していて、31/01/2010のような値を指定した場合、形式が無効であることを示すエラーメッセージが表示されます。

私はGlobalizeを使用しているため、多くの日付形式を使用するため、以下を使用します。

@Html.TextBoxFor(m => m.DateOfBirth, "{0:d}")

これにより、日付形式がブラウザーのロケール設定に自動的に調整されます。

表示は文化に依存することを覚えておいてください。そして、ほとんどの場合、他のすべての答えは正しいですが、私にとってはうまくいきませんでした。カルチャの問題は、添付されている場合、jQuery datepickerでもさまざまな問題を引き起こします。

/次の方法でフォーマットを強制的にエスケープする場合：

@Html.TextBoxFor(model => model.dtArrivalDate, "{0:MM\\/dd\\/yyyy}")

私のために逃げられなければ、それは08-01-2010予想と対比して表示されます08/01/2010ます。

また、エスケープされていない場合、jQueryの日付ピッカーは別のdefaultDateを選択しますが、私のインスタンスではでしたMay 10, 2012。

Bootstrapの日付ピッカーを使用している場合は、以下のようにdata_date_format属性を追加するだけです。

      @Html.TextBoxFor(m => m.StartDate, new { 
@id = "your-id", @class = "datepicker form-control input-datepicker", placeholder = "dd/mm/yyyy", data_date_format = "dd/mm/yyyy" 
})

// dattimeの表示はdatePickerで11/24/2011 12:00:00 AMです

//これをスペースで分割し、値を日付のみに設定できます

脚本：

    if ($("#StartDate").val() != '') {
        var arrDate = $('#StartDate').val().split(" ");
        $('#StartDate').val(arrDate[0]);
    }

マークアップ：

    <div class="editor-field">
        @Html.LabelFor(model => model.StartDate, "Start Date")
        @Html.TextBoxFor(model => model.StartDate, new { @class = "date-picker-needed" })
    </div>

これが役に立てば幸い

もちろん、Html.EditorForを使用できます。ただし、TextBoxForを使用してDisplayFormat属性の形式を使用する場合は、次のように使用できます。

@Html.TextBoxFor(model => model.dtArrivalDate, ModelMetadata.FromLambdaExpression(model => model.dtArrivalDate, ViewData).EditFormatString)

または次の拡張を作成します：

public static class HtmlExtensions
{
    public static MvcHtmlString TextBoxWithFormatFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes)
    {
        return htmlHelper.TextBoxFor(expression, ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData).EditFormatString, htmlAttributes);
    }
}

モデルの隣に追加するだけです。

[DataType(DataType.Date)]
public string dtArrivalDate { get; set; }

ASP.NET Coreでタグヘルパーを使用する場合、形式はISO形式で指定する必要があります。そのように指定されていない場合、バインドされた入力データは正しく表示されず、値のないmm / dd / yyyyとして表示されます。

モデル：

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

見る：

<input asp-for="Entity.HireDate" class="form-control" />

形式は、asp-format属性を使用してビューで指定することもできます。

結果のHTMLは次のようになります。

<input class="form-control" type="date" id="Entity_HireDate" 
    name="Entity.HireDate" value="2012-01-01">

以下のコードを使用して時間をHH：mm形式で出力できます。私の場合、プロパティタイプはTimeSpan なので、値はHH：mm：tt形式で表示されますが、上記の形式で表示する必要があります。HH：mm

したがって、このコードを使用できます。

@Html.TextBoxFor(x =>x.mTimeFrom, null, new {@Value =Model.mTimeFrom.ToString().Substring(0,5), @class = "form-control success" })

の使用を主張しているが[DisplayFormat]、MVC4を使用していない場合は、これを使用できます。

@Html.TextBoxFor(m => m.EndDate, new { Value = @Html.DisplayFor(m=>m.EndDate), @class="datepicker" })