<= Tilbake

Formattering med EditorTemplates

På lik linje med DisplayTemplates for visning har vi EditorTemplates for redigering (felter i skjema).
Vi har lyst til å bruke jQuery Datepicker på alle datofeltene våre, og for å få til det vil vi legge på Html-klassen "datepicker".

MVC leter etter editortemplates i Views/Shared/EdtiorTemplates.
Siden vi har satt [DateType(DataType.Date)] på datofeltet vårt kan vi kalle templaten vår for Date.cshtml. Hadde vi ikke gjort det måtte den hett DateTime.cshtml Views/Shared/EditorTemplates/Date.cshtml: 

@model DateTime?
	
@Html.TextBoxFor(m => Model, new {@class = "datepicker"})
For å bevare alle de viktige Html-attributtene som benyttes for validering bruker vi Html-hjelperen Html.TextBoxFor().

Inspiser datofeltet i nettleseren (høyre-klikk -> inspect). Vi har alle de viktige feltene og Html-klassen vi la til.
For å legge på jQuery Datepicker må vi inkludere js og css fra jQuery UI nederst i _Layout.cshtml, og kalle .datepicker()-metoden: 

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js" type="text/javascript"></script>
<script>
	$('.datepicker').datepicker({ dateFormat: 'dd.mm.yy' })
</script>
Velg fødselsdato på nytt og sjekk at den nye hippe datovelgern er på plass.


<= Tilbake