web-dev-qa-db-fra.com

MVC 4 Razor ajoutant le type d'entrée date

Je me demande comment insérer un <input type="date"/> pour les attributs datetime de mon modèle. Pour l'instant, Razor crée un élément brut avec type="datetime". Je souhaite utiliser les nouveaux types de saisie de HTML5.

html5razorasp.net-mvc-4
29
Geethanga

J'ai réussi à le faire en utilisant le code suivant.

@Html.TextBoxFor(model => model.EndTime, new { type = "time" })
31
Geethanga

Le format de valeur de date entré a besoin de la date spécifiée selon http://tools.ietf.org/html/rfc3339#section-5.6 full-date.

Alors j'ai fini par faire:

<input type="date" id="last-start-date" value="@string.Format("{0:yyyy-MM-dd}", Model.LastStartDate)" />

J'ai essayé de le faire "correctement" en utilisant:

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

avec 

@Html.TextBoxFor(model => model.LastStartDate, 
    new { type = "date" })

Malheureusement, cela semblait toujours définir l'attribut value de l'entrée sur une date/heure standard. J'ai donc fini par appliquer le formatage directement comme ci-dessus.

Modifier:

Selon Jorn si vous utilisez

@Html.EditorFor(model => model.LastStartDate)

au lieu de TextBoxFor tout fonctionne bien.

39
Giles Roberts

Si vous voulez utiliser @ Html.EditorFor (), vous devez utiliser jQuery ui et Mettre à jour votre Asp.net Mvc vers 5.2.6.0 avec NuGet Package Manager.

@Html.EditorFor(m => m.EntryDate, new { htmlAttributes = new { @class = "datepicker" } })

@section Scripts {

@Scripts.Render("~/bundles/jqueryval")


<script>

    $(document).ready(function(){

      $('.datepicker').datepicker();

     });

</script>

}

0
Md Shahriar
 @Html.TextBoxFor(m => m.EntryDate, new{ type = "date" })

 or type = "time"

 it will display a calendar
 it will not work if you give @Html.EditorFor()
0
Md Shahriar