H6: Create: Van formulier naar database

Create: van formulier naar database
WDV-III en DBS-I
Les H6 / Week 3
1 / 28
suivant
Slide 1: Diapositive
Applicatie- en mediaontwikkelaarMBOStudiejaar 1

Cette leçon contient 28 diapositives, avec quiz interactifs, diapositives de texte et 1 vidéo.

time-iconLa durée de la leçon est: 120 min

Éléments de cette leçon

Create: van formulier naar database
WDV-III en DBS-I
Les H6 / Week 3

Slide 1 - Diapositive

Even terugblikken

Slide 2 - Diapositive

Doelen van vandaag
  • Je kunt een formulier maken en bijhorende code in de controller schrijven om een nieuw item in te voegen in de database-tabel.
  • Je gebruikt PDO om met de database te werken; er is één verbinding in het hele project en je gebruikt bovendien placeholders en prepared statements bij het uitvoeren van een query.
  • Je schrijft een query eerst met gebruik van placeholders volgens de ":a" techniek.
  • Je hebt slechts één verbinding in je project, deze haal je erbij met require_once.
  •  Je zet de query met placeholders om naar een prepared statement en voert het uit.
  • Je kunt data zowel op de front-end als de back-end valideren of ze niet leeg zijn of indien nodig een getal bevatten.
  • Je toont een zinnige foutmelding aan de gebruiker, dit mag in de controller.
  • Je kunt inputs voorzien van de juiste attributen om ook hier validatie te doen.

Slide 3 - Diapositive

Eindproduct van vandaag:

Slide 4 - Diapositive

0

Slide 5 - Vidéo

Formulier versturen, hoe zat het ook alweer?
  • Formulier maak je in HTML
  • Verstuur naar controller in de backend
  • In PHP haal je ingevulde waarde uit het name-attribuut met $_POST['name'].
  • Een opgehaald gegeven sla je op in een variabele 

Slide 6 - Diapositive

Formulier versturen, hoe zat het ook alweer? (HTML)
  • We maken het formulier met de <form>-tag
  • Het formulier heeft twee attributen: action en method
  1. action: waar sturen we het formulier naartoe. Geef het pad mee.
  2. method: manier van versturen: POST
  • In het form zitten labels (tekst bij een input behorend).
  • input / select / textarea: velden die je gebruikt om de input van de gebruiker op te slaan. Altijd een name-attribuut.

Slide 7 - Diapositive

Op welke manier versturen we een formulier
A
GET
B
POST

Slide 8 - Quiz

Welk attribuut gebruiken we voor onze input, om vanuit onze controller in PHP de gegevens op te halen?
A
type
B
name
C
value
D
placeholder

Slide 9 - Quiz

Welk attribuut geeft informatie over het soort inputveld dat ik gemaakt heb?
A
type
B
name
C
value
D
placeholder

Slide 10 - Quiz

6.4 Opdracht: opzetten ontwikkelomgeving

Slide 11 - Diapositive

Mappenstructuur
  • backend/
              config.php
              conn.php
              resource1Controller.php
              resource2Controller.php
  • css/
  • img/
  • resource1/ 
              index.php
              create.php
              ............
  • resource2/
              index.php
              ......
index.php
header.php
........

Slide 12 - Diapositive

PHP verbinden met database

Slide 13 - Diapositive

Een query uitvoeren
1. Pak de databaseverbinding erbij.
2. Schrijf de query met placeholders.
3. Zet de query om naar een ‘prepared statement’.
4. Voer de statement uit, geef nu de ingevulde waarden mee.
En alleen voor een SELECT-query:
5. Haal het resultaat op (‘fetch’)

Slide 14 - Diapositive

Slide 15 - Diapositive

Slide 16 - Diapositive

Placeholders

  • :voorbeeld ----> $voorbeeld
  • Voorkomen van misbruiken van het formulier 
  • SQL-injectie voorkomen

Slide 17 - Diapositive

Opdracht 6.8 - INSERT-query uitvoeren

Slide 18 - Diapositive

Gebruiker terugsturen
  • Ingezonden informatie staat in de database
  • Gevolg is een witte pagina.
  • Controller is enkel om actie uit te voeren.
  • Gebruiker terug naar index-pagina sturen
  • Melding meegeven

Slide 19 - Diapositive

Opdracht 6.10 - Redirect toevoegen

Slide 20 - Diapositive

Een select (dropdown) versturen
  • Input type waarbij je opties geeft in dropdown.
  • Werkt in PHP hetzelfde als andere input
  • Het name attribuut vinden we in het select-element.
  • Het value-attribuut komt in PHP terecht.

Slide 21 - Diapositive

Checkbox versturen/ ontvangen
  • Alleen afvangen als deze is aangevinkt. 
  • isset()-functie om te controleren of de waarde bestaat in de $_POST-variabele.
  • Als variabele niet aanwezig is wordt deze op 'false' gezet.
  • Label-tags voor aangeven soort veld en uitleg specificatie vinkje.

Slide 22 - Diapositive

Opdracht 6.13 - Formulier afmaken
Wat: opdracht 6.13 in HTML en php
Hoe: in Sublime, phpmyadmin en browser
Uitkomst: succesvolle test, waarbij het toegevoegd is
Klaar: huiswerk van andere vakken bijwerken.
timer
15:00

Slide 23 - Diapositive

Don't trust the user: inputvalidatie
Controleren van de ingevulde formulier-waarden
Is een veld niet leeg? Is de leeftijd wel echt een getal?

Slide 24 - Diapositive

$errors[ ]
Je krijgt hiermee errors in een lijst (array).
Als de lijst bestaat, dumpen we alle errors en stoppen het script.

Slide 25 - Diapositive

Opdracht 6.15 - Validatie

Slide 26 - Diapositive

Zelf oefenen met CREATE
Wat: Opdracht 6.15, dan de herhalingsoefening van hoofdstuk H6 maken
Hoe: moduleboekje WDV-III en DBS-I pagina 28 en 29
Hulp: je buurman - daarna de docent
Tijd: 60 minuten
Uitkomst: een werkend formulier, waarbij ik gegevens aan de database kan toevoegen
Klaar: weekcheck H6 inleveren
timer
1:00:00

Slide 27 - Diapositive

Weekcheck H6: Storingsmelding
  • We beginnen deze week rustig aan: de weekcheck bestaat simpelweg uit het maken van alle opdrachten uit hoofdstuk 1. Als je klaar bent, kun je dus een storingsmelding aanmaken op dezelfde manier als in het filmpje uit paragraaf 2: https://youtu.be/FCmbeLvbUbg.
  • Inleveren: screenshot(s) van je meldingen/create.php en backend/meldingenController.php

Slide 28 - Diapositive