<= Tilbake

Validering med data-annoteringer

Den enkleste og beste måte å validere på i MVC er ved å annotere feltene i modellen med validerings-attributter. På samme måten som vi dekorerte feltene med "DisplayName" for å endre visningsnavnet kan vi legge på egne annotasjoner for validering. For å gjøre navne-feltene våre obligatorisk å fylle ut legger vi på [Required] 

[DisplayName("Fornavn")]
[Required]
public string FirstName { get; set; }
[DisplayName("Etternavn")]
[Required]
public string LastName { get; set; }
[DisplayName("Telefonnummer")]
Vi bygger på nytt (CTRL + F5) og forsøker å sende inn uten å fylle ut noe.

Det får vi fremdeles lov til. Vi har definert noen valideringsregler, men vi bruker de ikke til noen ting. For å gjøre det må vi gå til Create-metoden vår på PersonController: 

[HttpPost]
public ActionResult Create(PersonModel model)
{
	if (ModelState.IsValid)
	{
		return View("Show", model);
	}
	return View("Index", model);
}
Vi sjekker altså om inputen er valid ved hjelp av klassen ModelState som er innebygget i MVC. Dersom den er det viser vi personen, hvis ikke viser vi siden med skjemaet på nytt.
Vi bygger på nytt og tester både med og uten gyldig input.

Dette ser ut til å funke feiende flott, men det er et lite problem: Brukeren får ikke noen beskjed om hva som er feil. Vi legger derfor til valideringsmeldinger i skjemaet vårt med metodene Html.ValidationSummary() og Html.ValidationMessageFor(): 

@using (Html.BeginForm("Create", "Person")){

@Html.ValidationSummary()
@Html.ValidationMessageFor(m => m.FirstName)    
@Html.LabelFor(m => m.FirstName) 
@Html.TextBoxFor(m => m.FirstName)<br/>

@Html.ValidationMessageFor(m => m.LastName)
@Html.LabelFor(m => m.LastName) 
@Html.TextBoxFor(m => m.LastName)<br />

@Html.LabelFor(m => m.PhoneNumber) 
@Html.TextBoxFor(m => m.PhoneNumber)<br />

<input type="submit" value="Send inn" />

}
Og vips, vi har tilbakemeldinger. Nå er de ikke så synlige, så vi vil farge de røde. Vi inspiserer html-en i nettleseren (høyreklikk -> inspect) og ser at validerings-teksten og de ugyldige feltene har fått egne html-klasser. Vi vil bruke disse til å synliggjøre det som mangler og legger til følgende i Site.css: 
.validation-summary-errors, .field-validation-error {
    color: red;
}

.input-validation-error {
    border: 1px solid red;
}
Det eneste vi mangler nå er at feilmeldingene er på norsk. Vi legger derfor til feilmeldinger i [Required]-attributtene i PersonModel: 
[DisplayName("Fornavn")]
[Required(ErrorMessage = "Fornavn er obligatorisk")]
public string FirstName { get; set; }
[DisplayName("Etternavn")]
[Required(ErrorMessage =  "Etternavn er obligatorisk")]
public string LastName { get; set; }


<= Tilbake