Een databankgestuurde website met PHP maken in Dreamweaver

dynamische websites met PHP - 2009 - Kris Merckx

Dynamische websites met PHP

1. Kortstondige verbindingen met HTTPWanneer u een webadres in de URL-balk van een browser ingeeft, stuurt uw browser een vraag naar de server waarop die webpagina zich bevindt. Omdat de browser van de gebruiker en de server met elkaar zouden kunnen communiceren, moeten ze dezelfde 'taal' spreken. Die taal of de regels rond die taal zijn omschreven in een PROTOCOL. Het protocol voor het behandelen en afhandelen van de browservragen of REQUESTS, is het HTTP-protocol.HTTP staat voor Hypertext Transfer Protocol m.a.w. een geheel van regels voor het uitwisselen van hypertextdocumenten. Wanneer een gebruiker een HTML-pagina via zijn browser opvraagt, worden ook alle gelinkte documenten (afbeeldingen, CSS, javascript...) naar de browser gestuurd. De browser ontvangt het antwoord van de server (de RESPONSE), interpreteert de documenten een toont ze in een voor mensen 'leesbare' weergave (RENDERING).Eens de RESPONSE voltooid is, wordt de HTTP-verbinding tussen browser en server verbroken.

2. Verschillende soorten requestsDe browser kan op verschillende manieren een REQUEST of vraag sturen naar een server:

● head● get● post

GETBij de methode GET vraagt de gebruiker informatie of een webpagina op. Bijvoorbeeld:

www.blabla.be/map/mijndocument.html

Bij een GET-methode kunnen ook extra parameters meegestuurd worden. Bijvoorbeeld:

www.blabla.be/map/mijndocument.php?zoekterm=honden&taal=nl

De parameters worden toegevoegd na een vraagteken. De diverse parameters en hun waardes worden gescheiden door een &-teken.


Bijvoorbeeld:

www.blabla.be/map/mijndocument.php

Scheidingsteken ?

Parameter 1 zoekterm honden

Parameter 2 taal nl

Het heeft natuurlijk geen zin om willekeurig parameters te beginnen intikken. De webmaster bepaalt immers welk soort parameters hij zal interpreteren op de server. Parameters kunnen enkel 'begrepen' of 'geïnterpreteerd' worden door een stukje software op de server. Normale HTML-documenten kunnen parameters niet verwerken. Dynamische webpagina's (ASP, PHP, ASPX, JSP, CFM...) kunnen dat wel. Zulke pagina's bevatten naast gewone HTML-code programmacode die door de server wordt uitgevoerd en omgezet in HTML vooraleer ze naar de gebruiker worden verzonden.

Stap 1

Browser request met parameters PHP

Stap 2

Browser HTML PHP SERVER

Bij een statische website maakt de webmaster voor elk bericht, product of artikel een aparte webpagina aan. We spreken in dit geval van statische webpagina's. De informatie die in de pagina's is opgenomen, zit verpakt in het HTML-bestand. Willen we het uitzicht van de website veranderen, dan moeten we elke pagina opnieuw aanmaken of aanpassen in een programma als Dreamweaver of Aptana.

● Klassieke webpagina's in HTML bevatten 'vaste' informatie. Ze worden door de server naar de 'client' gestuurd in de vorm zoals de webmaster ze op de server heeft geplaatst.

● Dynamische webpagina's kunnen de parameters van een request interpreteren. Op basis daarvan kunnen ze andere informatie aan de gebruiker presenteren.

De informatie over bijvoorbeeld producten wordt ingevoerd in databanken. Met behulp van een scriptingtaal als PHP of ASP worden de webpagina's gevuld met die gegevens uit de databank of worden de webpagina's dynamisch opgebouwd. Vervolgens worden ze naar de clients doorgestuurd.

POSTBij de methode POST wordt informatie naar de server verzonden. Parameters en hun waarden worden hier niet zichtbaar via de adresbalk verzonden. Wanneer u een formulier


bouwt voor het verzenden van bijvoorbeeld een wachtwoord, kan u dan ook best gebruik maken van POST. Wanneer u in dit geval GET gebruikt, is het verzonden wachtwoord in de adresbalk en in de geschiedenis van de browser te zien.

3. Een praktijkvoorbeeld: een loginpagina

We maken een aanmeldpagina in HTML. HTML biedt mogelijkheden voor het bouwen van formulieren, invoervelden, selectielijsten enz. Met HTML kan u de informatie uit dit formulier verzenden naar een server, maar niet verwerken. U kan de verzonden informatie dus niet opvragen of verwerken met behulp van HTML.

Een vergelijking:Een formulier in HTML kan u vergelijken met een belastingaangifte. U (=CLIENT) kan uw gegevens invoeren. Vervolgens verstuurt u het formulier naar de dienst van de belastingen (=SERVER) of stopt u het in hun brievenbus. Voor het verwerken van de belastingbrieven en formulieren is er personeel (=SOFTWARE: PHP, ASP...) nodig. Vervolgens krijgt u feedback: hoeveel u nog moet bij betalen of terugkrijgt... (=RESPONSE).

Het verzendformulierWe starten met het opnemen van de HTML-tags voor een formulier. <form>

</form>

Als je de webpagina opvraagt in de browser, zal je nog steeds niets zien veranderen. We hebben immers nog geen knoppen, invulvelden of dergelijke voorzien. We moeten er een goede gewoonte van maken om elk onderdeel van een formulier te benoemen. Dat doen we door het attribuut "name" op te nemen in de HTMl-tags voor de formulierelementen. Waarom dit nodig is, zal je later merken.<form name="form">

</form>

We moeten het formulier ook vertellen waar het de ingevulde informatie naartoe moet sturen.<form name="form" action="login.php">

</form>

Vervolgens beslissen we ook welke verzendmethode we hiervoor zullen gebruiken. We kunnen kiezen tussen "GET" en "POST". - GET: als we informatie willen opvragen, vb. gegevens opvragen uit een bestaande databank- POST: informatie verzenden om te bewaren, vb. email, toevoegen aan een databank, gastenboek...


<form name="form" action="login.php" method="post">

</form>

In het formulier plaatsen we 2 invulvelden voor tekst.

In een tekstveld kan de gebruiker tekstinformatie invullen. Een tekstveld bestaat uit 1 regel. Je kan de lengte van het tekstveld instellen met het attribuut "size" en ook het maximaal aantal tekens vastleggen met "maxlength". We geven elk invoerveld ook een unieke naam (=name) en een uniek id. Er bestaan twee types tekstvelden.

● text● password: hierbij verschijnt de ingevoerde informatie als sterretjes of bolletjes.

<input name="gebruikersnaam" id="gebruikersnaam" type="text" maxlength="50">

<input name="wachtwoord" id="wachtwoord" type="password" maxlength="50">

Het uitzicht van de invoervelden kan u bepalen met behulp van CSS.Bijvoorbeeld: input{

color:black;

font: arial 10pt;

background: #cccccc;

border: 1px solid blue;

float:left;

}

label{

float:left;

clear:right;

}

Tot slot moeten we ook nog een verzendknop bij het formulier plaatsen. Het attribuut "value" bevat het opschrift van de knop. <input type="submit" name="verzend" id="verzend" value="OK">

of <button type="submit" name="verzend" id="verzend">OK</button>

Het volledige formulier ziet er nu als volgt uit:<form name="form" action="login.php" method="post">

<label>Gebruikersnaam:</label>


<input name="gebruikersnaam" id="gebruikersnaam" type="text" maxlength="50">

<label>Wachtwoord:</label>

<input name="wachtwoord" id="wachtwoord" type="password" maxlength="50">

<input type="submit" name="verzend" id="verzend" value="OK">

</form>

De verwerkingspagina login.php

Het formulier verzendt zijn informatie naar de webpagina met de naam login.php. We maken nu een webpagina aan met die naam en bewaren die in dezelfde map als de webpagina met het formulier. De pagina login.php kan de verzonden informatie uit het formulier opvragen, controleren, verwerken en zelfs opslaan. Natuurlijk volstaat het niet om hiervoor enkel een bestand aan te maken met de naam login.php. We moeten in het bestand ook manueel de benodigde code schrijven. Een dynamische webpagina (PHP, ASP...) bevat naast gewone HTML-markeringen en inhoud ook MIDDLEWARECODE (dus: code in een of andere programmeertaal of scriptingtaal). Om duidelijk te maken aan de server wat HTML is en wat MIDDLEWARECODE is, moeten we de codeblokken duidelijk scheiden van de HTML In PHP moeten codeblokken geplaatst worden tussen:<?

//hier komt de code...

?>

In PHP kunnen we de waarde (=value) van elke invoerveld in het verzonden (ge-post-e) formulier opvragen.Die waarde kunnen we opvragen op basis van de naam (=name) van elk invoerveld. In ons formulier stonden 2 invoervelden:

● het invoerveld met de naam "gebruikersnaam"● het invoerveld met de naam "wachtwoord"

Vergelijk de PHP-controlepagina met een kast met 2 laden. In de eerste schuif komt de naam terecht, in de tweede schuif het wachtwoord. In een derde lade zit de correcte gebruikersnaam, in de vierde het correcte wachtwoord. De gebruiker kan een correcte, maar ook een foutieve gebruikersnaam en/of wachtwoord ingeven. Als het 'correcte' wachtwoord wijzigt in de vierde schuif, moet ook de gebruiker in het formulier een ander wachtwoord invoeren. De gebruiker kan zich ook vergissen of een


foutje tikken... De doorgestuurde gegevens kunnen dus veranderen m.a.w. ze zijn VARIABEL. Ook de correcte gegevens kunnen gewijzigd worden, dus ook die gegevens zijn VARIABEL. Op elke schuif of lade zit een etiket met een benaming:

LADE ETIKET

lade 1 $VerzondenGebruikersnaam

lade 2 $VerzondenWachtwoord

lade 3 $CorrecteGebruikersnaam

lade 4 $CorrecteWachtwoord

OPMERKING:Variabele gegevens (etiketten) mag u zelf benoemen. U mag i.p.v. $CorrecteWachtwoord bijvoorbeeld ook $CW gebruiken of $JuisteWachtwoord.

Deze zogenaamde variabelen moeten met een $-teken beginnen.

Nu moeten we de waarden nog in de 'schuifjes' stoppen. Dit doen we op de onderstaande manier:$VerzondenGebruikersnaam= $_POST["gebruikersnaam"];

$VerzondenWachtwoord= $_POST["wachtwoord"];

De regel $_POST["wachtwoord"]; duidt aan dat de waarde is gePOST met een formulier. Binnen de haakjes en tussen aanhalingstekens plaatsen we de naam (name) van het invoerveld in het formulier. Elke regel eindigt met een PUNT KOMMA om de verschillende coderegels van elkaar te scheiden. $CorrecteGebruikersnaam= "kris";

$CorrecteWachtwoord= "azerty";

Met de bovenstaande regels stoppen we voorafbepaalde waarden in de variabelen $CorrecteGebruikersnaam en $CorrecteWachtwoord.

In een laatste stap moeten we de correcte waarden nog vergelijken met de doorgestuurde waarden. Dit kan op 2 manieren.

1. Ofwel controleren we of de beide doorgestuurde waarden correct zijn.2. Ofwel controleren we op een van beide fout is.


Mogelijkheid 1 in mensentaalAls de doorgestuurde gebruikersnaam gelijk is aan de correcte gebruikersnaam en het doorgestuurde wachtwoord gelijk is aan het correcte wachtwoord, toon de gebruiker dan dat hij is "aangemeld". In het andere geval meld je de gebruiker dan zijn gegevens fout zijn. Mogelijkheid 1 in PHPif($VerzondenGebruikersnaam==$CorrecteGebruikersnaam && $VerzondenWachtwoord==$CorrecteWachtwoord){

echo("U bent aangemeld");

}else{

echo("Uw gegevens zijn foutief.");

}

Mogelijkheid 2 in mensentaalAls de doorgestuurde gebruikersnaam foutief is OF het doorgestuurde wachtwoord is foutief, toon de gebruiker dan dat zijn gegevens foutief zijn. In het andere geval toon je dat de gebruiker is "aangemeld".

Mogelijkheid 2 in PHPif($VerzondenGebruikersnaam!=$CorrecteGebruikersnaam｜｜ $VerzondenWachtwoord!=$CorrecteWachtwoord){


}else{

echo("Uw bent aangemeld.");

}

Als u de code bestudeert, zal u merken dat er een als/dan/anders-structuur in verborgen zit.if(){} else{}

Uitleg mogelijkheid 1Wanneer u 2 waarden met elkaar moet vergelijken zoals in het bovenstaande voorbeeld, moet u 2 =-tekens plaatsen. Met één enkel =-teken wijst u een waarde toe zoals bij wiskunde:

3 + 2 = 5 (drie plus twee is gelijk aan vijf) > TOEWIJZING

x=3 (vanaf dit moment is x gelijk aan 3) > TOEWIJZING

MAAR

als x==3 (als x gelijk is aan 3...) > VERGELIJKING (CONTROLE OF 2 WAARDEN IDENTIEK ZIJN)


Als u meerdere waarden wil controleren of vergelijken, dan moet u alle 'vergelijkingen' scheiden door een &&-teken.

Uitleg mogelijkheid 2In het tweede codevoorbeeld controleren we of één van beide waarden foutief is. OF de gebruikersnaam is fout, OF het wachtwoord is fout....Een OF schrijven we in PHP met 2 rechte strepen (zonder spatie tussen!): .｜｜

x!=3 > VERGELIJK OF 2 WAARDEN VERSCHILLEND ZIJN

De volledige code (mogelijkheid 2)<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

<title>login.php</title>

</head>

<body>

<?$VerzondenGebruikersnaam= $_POST["gebruikersnaam"];

$VerzondenWachtwoord= $_POST["wachtwoord"];$CorrecteGebruikersnaam= "kris";


if($VerzondenGebruikersnaam!=$CorrecteGebruikersnaam｜｜ $VerzondenWachtwoord!=$CorrecteWachtwoord){


}else{

echo("Uw bent aangemeld.");

}

?>

</body>

</html>


4. Pagina's beveiligen met een sessieHet HTTP-protocol is stateless. Na de request en de response wordt de verbinding tussen client en server onherroepelijk verbroken. Dit betekent dat de server zich niet 'herinnert' wie (welke computer) reeds een request heeft gedaan. Het grote voordeel van een stateless-methode is dat niet alle verbindingen blijven open staan. Een webserver kan immers honderden of duizenden 'gelijktijdige' oproepen krijgen. Vermits elke verbinding een klein beetje geheugenruimte inneemt, zou de server al snel crashen.

Wanneer u in een POST-request een gebruikersnaam en wachtwoord verzendt, kan de server wel controleren of de verzonden gegevens correct zijn, maar de server kan niet onthouden welke gebruiker (computer) die gegevens heeft verzonden.

In de praktijk zou dit dan betekenen dat een gebruiker voor elke beveiligde pagina zijn gebruikersnaam en wachtwoord opnieuw zou moeten ingeven.

Om die tekortkoming van het HTTP-protocol te omzeilen zijn er diverse technieken ontwikkeld:

● cookies● sessies

Bij een sessie onthoudt de website/server voor een bepaalde tijd een unieke sleutel voor de aangemelde gebruiker/client. Die sessiesleutels worden ook als een soort cookie weggeschreven op de computer van de aangemelde gebruiker. Wanneer de gebruiker even later een nieuwe 'beveiligde' pagina opvraagt, dient de webpagina enkel nog te controleren of er op de server en de clientcomputer een gelijke sessiesleutel bestaat. Als dat het geval is, mag de gebruiken de beveiligde pagina zien, in het andere geval mag hij/zij de pagina niet bekijken.

Een sessie starten...In PHP moeten we de sessie starten met session_start();Vervolgens kan u een aantal sessievariabelen aanmaken. Een sessievariabele moet er altijd als volgt uitzien $_SESSION['']. Tussen de aanhalingstekens (weglatingstekens) kan u een naam geven aan de sessievariabele. U wijst de sessievariabele een waarde toe met een =-teken.U kan een cijfer (nummer) toekennen of een woord (string). Wanneer u een woord toekent als 'waarde', moet u het tussen aanhalingstekens plaatsen.

<?

session_start();

$_SESSION['gebruiker']=1;

$_SESSION['naam']="kris";

?>

In het voorbeeld hierboven geven de sessievariabele gebruiker de waarde 1. De waarde 1 heeft in dit geval de betekenis TRUE (waar).

De bedoeling is natuurlijk dat u de sessie pas start als de doorgestuurde gebruikersnaam en wachtwoord correct zijn.







}else{

echo("Uw bent aangemeld.");session_start();


}

?>

Hier treedt echter een probleem op. Een session_start() moet in PHP altijd voor de HTML-code geplaatst worden. Dit betekent dat we het hele bovenstaande codeblok moeten verhuizen naar het begin van de HTML-pagina.<?$VerzondenGebruikersnaam= $_POST["gebruikersnaam"];





}else{

echo("Uw bent aangemeld.");session_start();


}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<head>

...

Maar het heeft geen zin om een echo() uit te voeren voor het begin van de webpagina. We moeten nog een kleine aanpassing doen. We stoppen de feedback die we aan de gebruiker willen geven in een variabele met de naam $reactie.


We vullen de variabele $reactie al met een 'waarde' voor de HTML-code. We 'drukken' de variabele pas af in de body van het HTML-document.





$reactie="Uw gegevens zijn foutief.";

}else{

$reactie="Uw bent aangemeld.";session_start();


}

?>



<head>


<title>login.php</title>

</head>

<body>

<?

echo($reactie);

?>

</body>

</html>


Andere pagina's beveiligen met een sessievariabeleU kan enkel pagina's met de extensie PHP beveiligen via een sessie. Documenten met de extensie htm of html of afbeeldingen kan u op deze manier niet beveiligen. Elke beveiligd PHP-document moet als eerste regel de onderstaande code bevatten:<?session_start();?>

Vervolgens zal u in het document moeten controleren of de sessievariabele bestaat. Als dat niet het geval is, mag de gebruiker de inhoud van het document niet lezen.

In mensentaal

Als er een sleutel met de naam gebruiker bestaat en die sleutel bevat een waarde, dan kan je de gebruiker de geheime informatie tonen. In het andere geval meld je de gebruiker dat hij geen toegang heeft tot de informatie.

In PHP-code<?if(isset($_SESSION['gebruiker'])){

?>

Hier staat de geheime info...<br/>

Hier kan u teksten, links en afbeeldingen in HTML-markeringen aan toevoegen.

<?

}else{

echo("U heeft geen toegang tot de informatie");

}

?>

Let goed op het gebruik van de haakjes:

$_SESSION['gebruiker']

isset ($_SESSION['gebruiker'])

if (isset ($_SESSION['gebruiker'])) { }


Een volledig beveiligde pagina kan er als volgt uitzien:<?session_start();?>



<head>


<title></title>

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>

<link rel="stylesheet" type="text/css" href=".css"/>

</head>

<body>

<?

if(isset($_SESSION['gebruiker'])){

echo($_SESSION['gebruiker']);

?>

Hier staat de geheime info...<br/>

<?

}else{

echo($_SESSION['gebruiker']);

echo("U heeft geen toegang tot de informatie");

}

?>

</body>

</html>


Een sessie beëindigenStandaard onthoudt een server een 'sessiesleutel' gedurende zeer beperkte tijd (10 tot 20 minuten). Wanneer de gebruiker binnen die tijd beveiligde pagina's blijft opvragen, kan die sessie automatisch worden verlengd. Met PHP-code kan u een sessie voortijdig beëindigen bijvoorbeeld wanneer een gebruiker op een link afmelden zou klikken. We maken in elke beveiligde webpagina een HTML-link naar de pagina endsession.php.<a href="endsession.php">Afmelden</a>

Vervolgens maak je een nieuwe HTML-pagina aan en je voegt de onderstaande code toe boven de eerste HTML-regel:<?

session_start();

session_destroy();

header("Location:aanmeldformulier.php");

?>

De regel session_destroy(); verwijdert de sessiegegevens van de server. De laatste regel stuurt je browser automatisch door naar de formulierpagina. Natuurlijk kan u de naam aanmeldformulier.php vervangen door de naam van uw eigen formulierpagina.


5. Apache op uw computerDe open source webserver is zonder twijfel de meest gebruikte server. Hij is beschikbaar voor Windows, Linux, Mac OS X en diverse andere Unix-systemen. Op internetservers wordt hij meestal gebruikt in combinatie met het besturingssysteem Linux, de scriptingtaal PHP en het databanksysteem MySQL.

In dit hoofdstuk zullen we PHP-pagina's bouwen met Adobe Dreamweaver die kunnen 'praten' met een MySQL-databank. Hiervoor zullen we Apache, PHP en MySQL op onze eigen computer installeren. Op de website www.xampp.org wordt een kant-en-klare installatie met talloze voorbeelden aangeboden voor Windows, Mac OS X en Linux.Download en installeer het programma volgens de instructies op de website. Op de website vindt u eveneens instructies voor het opstarten van de webserver. Onder Windows kan u XAMPP installeren als een systeemservice waardoor Apache bij de start van uw computer onmiddellijk wordt opgestart.

Vooraleer we van start kunnen gaan met Dreamweaver, moet u de Apache-server, PHP en MySQL in elk geval opstarten. Open uw webbrowser en voer http://localhost in in de adresbalk om te controleren of de installatie is gelukt en/of XAMPP draait.

http://www.xampp.org/

http://localhost/


6. Spreken met een databank

Informatie structureren met MySQLMySQL is een databanksysteem. Een databank kan gestructureerde informatie opslaan in tabellen. Met PHP kunnen we de informatie uit zo'n tabel automatisch laten omzetten in HTML. Bijvoorbeeld: de boekenlijst van een bibliotheek, winkelwaren, een CD-collectie, krantenartikels...Een krantenartikel bevat bijvoorbeeld steeds dezelfde onderdelen:● een titel● een inleiding● een tekst● een auteur● een datum

In een databanktabel zou dit er als volgt uitzien:

id titel inleiding tekst auteur datum

Het id is een uniek nummer voor elk artikel.

FRONTEND

Een databanktabel omzetten in HTML Vooraleer we ons verder verdiepen in het databanksysteem MySQL gebruiken we Adobe Dreamweaver om een PHP-pagina aan te maken die informatie een voorbeelddatabank kan ophalen. XAMPP komt standaard immers met een aantal demo-databanken.1. Maak een nieuw PHP-bestand in Dreamweaver.


2. Klik op de het +-symbool in het tabblad Server Behaviors. Kies Recordset.

3. Het venster Recordset verschijnt.


4. Geef een naam aan de recordset, bijvoorbeeld rsCDs.5. Klik op de knop Define...

6. Het venster Connections for... verschijnt. Klik op New.


7. Het venster MySQL Connection verschijnt.

8. Geef een naam aan de Connection Name, bijvoorbeeld cdcollectie. Tik localhost in bij MySQL server, en root bij Username.


9. Klik op de knop Select...10. Je krijgt de lijst van aanwezige databanken in MySQL te zien. Selecteer cdcol en klik op OK.

11. Mogelijk krijgt u een foumelding omdat u geen wachtwoord heeft ingegeven. Klik op OK.


12. In geval van die waarschuwing voert u even een paar letters in in het veld van het wachtwoord en u verwijdert ze meteen weer. Klik nogmaals op OK. De foutmelding verschijnt niet meer.

13. Bij Connection staat nu cdcollectie geselecteerd.


14. Selecteer cds bij Table. Kies titel uit de vervolgkeuzelijst bij Sort.

15. Klik op OK.16. Klik bovenaan in de lijst Server Behaviors op het +-symbool en selecteer Dynamic Text.


17. Selecteer Dynamic Text.

18. Kies Titel en klik op OK.


19. In de code van de webpagina is nu een hele reeks PHP-code toegevoegd. In de Design view zie je een regeltje verschijnen {rsCDs.titel} (of iets in die aard).

20. Herhaal de stappen 17 tot en met 19 tot alle onderdelen van het recordset worden weergegeven.


21. Selecteer nu alle zichtbare meldingen in de Design view.

22. Klik op het +-symbool bij Server Behaviors en selecteer Repeat Region.


23. Je kan nu ingeven hoeveel records per keer in het herhalingsgebied moeten worden weergegeven. D.w.z. in de databanktabel zitten een aantal rijen. Hoeveel rijen toon je per keer in de webpagina. Je kan ze allemaal tonen of met een beperkt aantal. Achteraf voegen we een vorige- en volgende-knop toe om door de "rijen" (records) te navigeren.

24. Klik op OK. Het herhalingsgebied wordt nu getoond met een grijs kader. Dit kader zal natuurlijk niet te zien zijn in de uiteindelijke webpagina.


25. We kiezen nu Recordset Paging > Move To Previous Page.

26. Kies de optie Create new link... en klik op OK.


27. De link Previous staat nu in de Design view. Ga er achter staan met de muiscursor en klik op ENTER.

28. Kies nu Recordset Paging > Move To Next Page.


29. Kies ook nu voor de optie Create new link "Next" en klik op OK.

30. De link Previous en Next staan nu in de Design view.


31. Je kan de tekst Previous nu vervangen door Vorige.

32. Je kan de link Next nu vervangen door Volgende.


33. Dubbelklik op Repeat Region in het palet Server Behaviors om het aantal weer te geven records per pagina aan te passen.

34. Sla het bestand op als een PHP-bestand en test het uit in uw browser. Let echter op: de Apache server en MySQL moeten op de achtergrond actief zijn.


BACKEND

Records verwijderen uit de databank met PHP1. Maak een nieuwe PHP-pagina.

2. Kies Server behaviors > Recordset.


3. Kies de reeds gemaakte verbinding en klik op OK.

4. De Recordset is nu toegevoegd.


5. Kies Dynamic Text.

6. Selecteer de Titel. Klik op OK.


7. De Dynamic Text is nu toegevoegd.

8. Herhaal stap 6 en 7 om ook het ID toe te voegen.


9. Voeg nu het ID toe en klik op OK.

10. Ook het ID is nu toegevoegd.


11. Selecteer alles in het Design view en kies Server Behaviors > Repeat Region.

12. Selecteer All records of kies een aantal. Als u voor een 'beperkt aantal' kiest, mag u achteraf niet vergeten ook een vooruit- en achteruit- navigatieknop toe te voegen. Klik op OK.


13. Selecteer {Recordset:titel}

14. Voeg onderaan in het eigenschappenpalet de volgende link toe: delete.php?id=


15. Open het codevenster.

16. Selecteer in het covenster het codefragment <?php echo $row_Recordset [id]?>


17. Sleep dit stukje code (met de linkermuisknop ingedrukt naar voren tot achter de

link delete.php?id=De code ziet er nu uit zoals in het voorbeeld hieronder:

<a href="delete.php?id=<?php echo $row_Recordset [id]?>"> (enzoverder...)

18. Bewaar de pagina nu als delete.php.


19. Kies vervolgens voor Server Behaviors > Delete Record.

20. Kies de juiste verbinding bij Connection. Zorg dat de instellingen dezelfde zijn als

in de schermafbeelding hieronder. Voer ok.php in achter After deleting, go to...Klik op OK.


21. Als u bij stap 12 niet gekozen heeft voor All records, moet u nu ook nog een

vooruit- en achteruit-navigatieknop toevoegen via Server Behaviors...

22. Bewaar de aangepaste pagina.

23. Maak nu een nieuwe lege PHP-pagina met de naam ok.php. Voeg daaraan de

html-code toe: De aanpassingen zijn succesvol uitgevoerd.

<a href="delete.php">Nog een record verwijderen.</a>

Records uit de databank updaten met PHPWe maken nu een formulier waarin de records uit de databank worden geopend. Als je de gegevens in het formulier aanpast en op de knop Bewaar klikt, wordt de aangepaste informatie aan de databank toegevoegd.

1. Maak een nieuwe PHP-pagina.2. Selecteer het tabblad Forms.

3. Klik op het eerste knopje om een formulier toe te voegen aan de pagina. Er verschijnt nu een rode stippellijn in het ontwerpvenster.

4. We maken een formulierveld aan voor elk onderdeel van het databankrecord.5. Klik op het knopje voor het toevoegen van een tekstveld. 6. Het venster met de instellingen voor het tekstveld verschijnt in beeld.

7. Tik titel bij ID en Titel: bij Label. Voer bij Tab Index het cijfer 0 in.

Klik vervolgens op OK.

8. Herhaal stap 7 en voer achter elkaar de volgende informatie in:

ID interpretLabel Uitvoerder:Tab Index 1

ID jahrLabel Jaar:Tab Index 2


9. De formuliervelden verschijnen nu in het ontwerpvenster.

10. Klik nu op het knopje om een verborgen tekstveld toe te voegen. Hierin zullen we achter het unieke ID-nummer van het databaserecord onthouden.

11. Selecteer het "verborgen tekstveld" in het ontwerpvenster en voer in het eigenschappenpalet de benaming id in bij HiddenField.


12. Voer een Submit-knop toe uit het tabblad Forms.

13. Voer onderaan de tekst Bewaar in bij Init Value.

14. Voer de volgende informatie in in het eigenschappenvenster:

ID bewaarLabelTab Index 3


15. Ga nu naar Server Behaviors > Recordset.16. Selecteer de verbinding cdcollectie en klik op OK.

17. Kies Server Behaviors > Dynamic text.18. Selecteer titel en klik op OK.

19. Herhaal stap 18 voor interpret, jahr en id.


20. De diverse onderdelen van de databanktabel staan nu in het ontwerpvenster. 21. Selecteer alles en kies Server Behaviors > Repeat Region.

22.Kies Recordset Paging > Move To Previous Page.

23. Klik op OK. De link verschijnt in het ontwerpvenster. Ga er achter staan met de muiscursor en klik op de ENTER-toets.


24. Herhaal stap 22 en voer ook een volgende (next-)knop toe.

25. Selecteer het eerste tekstveld en voer onderaan in het eigenschappenvenster een willekeurig teken in bij Init val. In ons voorbeeld hebben we de letter "p" toegevoegd.


26. Herhaal stap 25 voor de twee andere tekstvelden. U ziet nu in elk tekstveld de letter "p" verschijnen. We zullen die waarde later vervangen door de informatie uit de databank.

27. Selecteer in het ontwerpvenster ook het verborgen tekstveld en voer in het eigenschappenpalet ook de waarde "p" in bij value.


28. Schakel over naar het codevenster.29. Verwijder de waarde p in de volgende coderegel.

<input name="titel" type="text" id="titel" tabindex="0" value="p" />

Moet worden: <input name="titel" type="text" id="titel" tabindex="0" value="" />

30. Selecteer de onderstaande coderegel:<?php echo $row_Recordset1['titel']; ?

31. Versleep de geselecteerde code met de linkermuisknop ingedrukt totdat de code er als volgt uitziet:

<input name="titel" type="text" id="titel" tabindex="0" value="<?php echo $row_Recordset1['titel']; ?>" />

32. Herhaal de stappen 29, 30 en 31 voor interpret, jahr en id. <label>Uitvoerder:

<input name="interpret" type="text" id="interpret" tabindex="1" value="<?php echo $row_Recordset1['interpret']; ?>" />

</label>

</p>

<p>

<label>Jaar:

<input name="jahr" type="text" id="jahr" tabindex="2" value="<?php echo $row_Recordset1['jahr']; ?>" />

</label>

</p>

<p>

<input name="id" type="hidden" id="id" value="<?php echo


$row_Recordset1['id']; ?>" />

</p>

33. Kies Server Behaviors > Update Record.

34. Een venster verschijnt waarin je kan controleren of het juiste formulierveld gekoppeld is aan het correcte veld in de databanktabel.


35. Tik onderaan ok.php in het veld achter After updating, go to:.

36. Bewaar het bestand als update.php.

Een databankgestuurde website met PHP maken in Dreamweaver

Documents

Transcript of Een databankgestuurde website met PHP maken in Dreamweaver