Date uniquement de TextBoxFor ()

J'ai du mal à afficher la seule partie date d'un DateTime dans une zone de texte à l'aide de TextBoxFor <,> (expression, htmlAttributes).

Le modèle est basé sur Linq2SQL, le champ est un DateTime sur SQL et dans le modèle Entity.

Échoué:

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

Cette astuce semble être dépréciée, toute valeur de chaîne dans l'objet htmlAttribute est ignorée.

Échoué:

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

Je voudrais stocker et afficher uniquement la partie date sur la vue détails / édition, sans la partie "00:00:00".

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

Ensuite:

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

MVC4 a résolu ce problème en ajoutant une nouvelle TextBoxForsurcharge, qui prend un paramètre de format de chaîne. Vous pouvez maintenant simplement faire ceci:

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

Il y a aussi une surcharge qui prend des attributs html, vous pouvez donc définir la classe CSS, câbler les sélecteurs de date, etc.:

@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") })%>

Ou utilisez les aides non typées:

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

Cela a fonctionné pour moi.

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

N'ayez pas peur d'utiliser du HTML brut.

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

TL; DR;

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

L'application [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]n'a pas fonctionné pour moi!

Explication:

Afin d'afficher une propriété date de votre modèle à l'aide de Html.TextBoxFor:

Propriété Date de votre classe de modèle:

public DateTime DOB { get; set; }

Rien d'autre n'est nécessaire du côté du modèle.

Dans Razor, vous faites:

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

Explication:

La date d'un inputélément html de type datedoit être formatée par rapport à ISO8601 , qui est:yyyy-MM-dd

La date affichée est formatée en fonction des paramètres régionaux du navigateur de l'utilisateur, mais la valeur analysée est toujours formatée aaaa-mm-jj.

D'après mon expérience, la langue n'est pas déterminée par l'en- Accept-Languagetête, mais par la langue d'affichage du navigateur ou la langue du système d'exploitation.

Vous pouvez également utiliser les attributs HTML 5 en appliquant cette annotation de données:

[DataType(DataType.Date)]

Mais le problème est que cela permet un sélecteur de date spécifique au navigateur pour les navigateurs HTML 5. Vous avez toujours besoin de votre propre sélecteur de date pour les navigateurs sans prise en charge, puis vous devez vous assurer que votre sélecteur de date n'apparaît pas en plus d'un navigateur (Modernizr peut le faire facilement), ou masquer le navigateur s'il le fait (compliqué et je Je ne sais pas à quel point les méthodes que j'ai vues étaient fiables).

En fin de compte, je suis allé avec Alex parce que mon environnement actuel n'a pas Modernizr, mais si c'était le cas, je l'aurais utilisé pour afficher conditionnellement mon sélecteur de données uniquement si le navigateur ne le supportait pas déjà.

Pour moi, je devais garder le TextboxFor()car l'utilisation EditorFor()change le type d'entrée à ce jour. Ce qui, dans Chrome, ajoute un sélecteur de date intégré, qui a foiré le sélecteur de date jQuery que j'utilisais déjà. Donc, pour continuer à utiliser TextboxFor()ET uniquement pour afficher la date, vous pouvez le faire:

<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>

L'attribut DisplayFormat n'a pas fonctionné pour moi sous aucune forme lors du chargement initial. J'ai plutôt créé un 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" }) %>

L'éditeur de modèles fonctionnera uniquement à des fins d'affichage. Si vous utilisez le même éditeur (ce qui est logique car c'est un éditeur) et que vous avez fourni une valeur comme 31/01/2010 - vous obtiendrez un message d'erreur indiquant que le format n'est pas valide.

J'utilise Globalize donc je travaille avec de nombreux formats de date, utilisez donc ce qui suit:

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

Cela ajustera automatiquement le format de la date aux paramètres régionaux du navigateur.

Gardez à l'esprit que l'affichage dépendra de la culture. Et bien que dans la plupart des cas, toutes les autres réponses soient correctes, cela n'a pas fonctionné pour moi. Le problème de culture entraînera également différents problèmes avec jQuery datepicker, s'il est joint.

Si vous souhaitez forcer l'échappement du format /de la manière suivante:

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

Si ce n'est pas échappé pour moi, cela montre 08-01-2010vs prévu 08/01/2010.

De plus, s'il n'est pas échappé, jQuery datepicker sélectionnera une autre date par défaut, dans mon cas c'était le cas May 10, 2012.

Si vous utilisez le sélecteur de date Bootstrap, vous pouvez simplement ajouter l' attribut data_date_format comme ci-dessous.

      @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" 
})

// la date et l'heure s'affichent dans la datePicker est le 11/24/2011 12:00:00 AM

// vous pouvez diviser cela par espace et définir la valeur à date uniquement

Scénario:

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

Balisage:

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

J'espère que cela aide ..

Bien sûr, vous pouvez utiliser Html.EditorFor. Mais si vous souhaitez utiliser TextBoxFor et utiliser le format de l'attribut DisplayFormat, vous pouvez l'utiliser de cette manière:

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

ou créez la prochaine extension:

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);
    }
}

Ajoutez juste à côté de votre modèle.

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

Lorsque vous utilisez des assistants de balise dans ASP.NET Core, le format doit être spécifié au format ISO. Si elles ne sont pas spécifiées comme telles, les données d'entrée liées ne s'afficheront pas correctement et s'afficheront en mm / jj / aaaa sans valeur.

Modèle:

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

Vue:

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

Le format peut également être spécifié dans la vue à l'aide de l'attribut asp-format.

Le code HTML résultant se présente comme suit:

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

Vous pouvez utiliser le code ci-dessous pour imprimer l'heure au format HH: mm . Dans mon cas, le type de propriété est TimeSpan. La valeur vient donc au format HH: mm: tt, mais je dois l'afficher au format ci-dessus. HH: mm

Vous pouvez donc utiliser ce code:

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

Si vous insistez pour utiliser le [DisplayFormat], mais que vous n'utilisez pas MVC4, vous pouvez utiliser ceci:

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