.net - gegevens versturen

Werken met formulieren in .net
  • Je kan gegevens versturen en ontvangen
  • Je kan controleren of een formulier juist/valide is ingevuld
  • Je kan nette meldingen tonen indien het formulier niet juist is ingevuld
1 / 12
volgende
Slide 1: Tekstslide
InformaticaMiddelbare schoolvwoLeerjaar 5,6

In deze les zitten 12 slides, met interactieve quiz en tekstslides.

Onderdelen in deze les

Werken met formulieren in .net
  • Je kan gegevens versturen en ontvangen
  • Je kan controleren of een formulier juist/valide is ingevuld
  • Je kan nette meldingen tonen indien het formulier niet juist is ingevuld

Slide 1 - Tekstslide

Deze slide heeft geen instructies

Scrum-master
Product-owner
Team
Zorgt dat er post-its zijn
Bepaalt wat er gedaan wordt komende sprint
Is eigenaar van het product

Slide 2 - Sleepvraag

Product-owner vertegenwoordigd de klant. Maar is niet perse de eigenaar. Vaak niet zelfs
Contact formulier
Maak een nieuw bestand contact.cshtml en neem de onderstaande code over.

Een formulier hebben jullie al eerder gemaakt, maar nog niet mee gewerkt. Let vooral even op de method en de name attributen in de html.

POST is een manier om gegevens te versturen die je vaak gebruikt als je de gegevens gaat verwerken.

Slide 3 - Tekstslide

Deze slide heeft geen instructies

Contact formulier
Open homecontroller.cs en voeg deze twee methods toe. De eerste method zorgt ervoor dat we bij onze contact pagina kunnen komen als we naar /contact surfen.
De tweede method lijkt hetzelfde maar omdat er [HttpPost] staat weet de controller dat er POST gegevens binnen kunnen komen. 
Output

Slide 4 - Tekstslide

Deze slide heeft geen instructies

Contact formulier
We kunnen makkelijk zien of onze POST werkt door de gegevens weer in de View te tekenen. We gebruiken hiervoor weer het truucje met de ViewData:
Output

Slide 5 - Tekstslide

Deze slide heeft geen instructies

Een model gebruiken
We gaan straks wat geavanceerde functies gebruiken en daarvoor hebben we een object nodig van het contactformulier. In dit geval gaat het om gegevens van een persoon dus we maken een nieuw bestand PersonModel.cs

Deze vullen we met properties die we van de persoon willen hebben. Let op de datatypes!

Slide 6 - Tekstslide

Deze slide heeft geen instructies

Een model gebruiken
Pas nu je method aan om in plaats van twee strings een PersonModel te gebruiken
In plaats van string voornaam, string achternaam gebruiken we nu één argument: PersonModel model
We gebruiken PersonModel als Model van deze View
De gegevens halen we nu niet meer uit de ViewData maar uit het Model.

Klein detail: als er geen model is (null) dat krijgen we een error als we de Voornaam of Achternaam proberen op te vragen. Daarom zit er een check omheen of het object wel bestaat

Slide 7 - Tekstslide

Deze slide heeft geen instructies

Een model valideren
Vaak wil je toch wel minimaal bepaalde gegevens van iemand hebben voordat je ze gaat opslaan of er mee aan de slag gaat. Een achternaam en een e-mail adres zijn vaak erg handig. 
Door het attribuut [required] te gebruiken geef je aan dat deze property niet leeg mag zijn.
Door het attribuut [EmailAddress] te gebruiken wordt er gecontroleerd of wat is ingevuld wel een geldig e-mail adres is.

Slide 8 - Tekstslide

Deze slide heeft geen instructies

Een model valideren
Nu we gezegd hebben wat er ingevuld moet worden moeten we dat ook aan de gebruiker laten weten.

Of in dit geval eigenlijk, laten weten als het niet is ingevuld. Daarvoor gebruiken we @Html.ValidationMessage

Slide 9 - Tekstslide

Deze slide heeft geen instructies

 Custom foutmeldingen
Hee! Maar daar stonden nederlandse foutmeldingen en ik/wij hebben engelse!

Ja ik had er nog wat dingen bij getiept in PersonModel.cs...

Slide 10 - Tekstslide

Deze slide heeft geen instructies

De volgende keer..

Gaan we ook echt iets doen met die gegevens.. opslaan ofzo ;)
lgg .net c#

Slide 11 - Tekstslide

Deze slide heeft geen instructies

Maak nu je eigen (mooie) contactformulier

Volgende week
Persoonsgegevens opslaan
lgg .net c#

Slide 12 - Tekstslide

Deze slide heeft geen instructies