HTML + PHP
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<?php
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: #ffffff;
}
#mainContainer {
width: 560px;
margin: 0 auto;
overflow: auto;
text-align: center;
background-color: #000000;
}
#titleContainer{
color: #ffffff;
}
.studentContainer{
overflow: auto;
}
.dataContainer{
float: left;
width: 100px;
padding: 10px;
margin: 10px;
background-color: #999999;
}
}
</style>
</head>
[code]<?php
include ('connect.php');
$students = mysqli_query($connect, "SELECT * FROM `students` ORDER BY `studentId` ASC");
?>
<body>
<div id = mainContainer>
<div id = titleContainer>
voorbeeld
</div>
<?php
while ($record = mysqli_fetch_array($students))
{
?> <div class = studentContainer>
<div class = dataContainer>
<?php echo $record['id'] ?>
</div>
<div class = dataContainer>
<?php echo $record['firstName'] ?>
</div>
<div class = dataContainer>
<?php echo$record['surname'] ?>
</div>
<div class = dataContainer>
<?php echo $record['age'] ?>
</div>
</div>
<?php } ?>
</div>
</body>
</html>
?>
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: #ffffff;
}
#mainContainer {
width: 560px;
margin: 0 auto;
overflow: auto;
text-align: center;
background-color: #000000;
}
#titleContainer{
color: #ffffff;
}
.studentContainer{
overflow: auto;
}
.dataContainer{
float: left;
width: 100px;
padding: 10px;
margin: 10px;
background-color: #999999;
}
}
</style>
</head>
[code]<?php
include ('connect.php');
$students = mysqli_query($connect, "SELECT * FROM `students` ORDER BY `studentId` ASC");
?>
<body>
<div id = mainContainer>
<div id = titleContainer>
voorbeeld
</div>
<?php
while ($record = mysqli_fetch_array($students))
{
?> <div class = studentContainer>
<div class = dataContainer>
<?php echo $record['id'] ?>
</div>
<div class = dataContainer>
<?php echo $record['firstName'] ?>
</div>
<div class = dataContainer>
<?php echo$record['surname'] ?>
</div>
<div class = dataContainer>
<?php echo $record['age'] ?>
</div>
</div>
<?php } ?>
</div>
</body>
</html>
?>
Gewijzigd op 15/04/2015 12:55:16 door Koh do
Ik zou je adviseren om html en php te scheiden van elkaar. Kijk bijv. maar eens naar templatepower of smarty.
Persoonlijk ben ik niet meer zo verzot op Smarty. Het is bloated, en neemt behoorlijk meer geheugen in terwijl je met PHP alleen sneller uit de voeten kunt met een eigen geschreven templatesysteem die volledig op PHP's basisfuncties leunt.
@koh do, je moet gewoon doen wat jij fijn vindt en alles wat de leesbaarheid bevordert lijkt mij een positieve zaak. Van jouw bovenstaande fragment zou ik het volgende maken:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<?php
require './includes/connect.php';
require './includes/functions.php';
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link href="media/css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="mainContainer">
<div id="titleContainer">voorbeeld</div><?php
$res = mysqli_query($connect,
'SELECT *
FROM students
ORDER BY studentId ASC'
);
if ($res === false) {
?><p>Query error.</p><?php
} else {
if (mysqli_num_rows($res)) {
while ($row = mysqli_fetch_assoc($res)) {
?><div class="studentContainer">
<div><?php echo escape($row['id']) ?></div>
<div><?php echo escape($row['firstName']) ?></div>
<div><?php echo escape($row['surname']) ?></div>
<div><?php echo escape($row['age']) ?></div>
</div><?php
}
} else {
?><p>Geen resultaten.</p><?php
}
mysqli_free_result($res);
}
?></div>
</body>
</html>
require './includes/connect.php';
require './includes/functions.php';
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link href="media/css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="mainContainer">
<div id="titleContainer">voorbeeld</div><?php
$res = mysqli_query($connect,
'SELECT *
FROM students
ORDER BY studentId ASC'
);
if ($res === false) {
?><p>Query error.</p><?php
} else {
if (mysqli_num_rows($res)) {
while ($row = mysqli_fetch_assoc($res)) {
?><div class="studentContainer">
<div><?php echo escape($row['id']) ?></div>
<div><?php echo escape($row['firstName']) ?></div>
<div><?php echo escape($row['surname']) ?></div>
<div><?php echo escape($row['age']) ?></div>
</div><?php
}
} else {
?><p>Geen resultaten.</p><?php
}
mysqli_free_result($res);
}
?></div>
</body>
</html>
- maak voor zaken met een specifiek doel (database, hulpfuncties) aparte bestanden of classes
- include alle PHP-bestanden voordat je document begint, als dit gaat
- organiseer e.e.a. in directories zodat je snel bestanden terug kunt vinden
- spring zowel HTML (waar nodig) en PHP (eigenlijk altijd) in en zet het inspringen van HTML in PHP voort en andersom
- verpak PHP luchtdicht in HTML en andersom, dit leest, in combinatie met het inspringen, best fijn, je kunt heel snel visueel zien op welke diepte een PHP- of HTML-blok zich bevindt
- alles heeft een character encoding: je database, je HTML, je PHP document, wees hier expliciet in of bereid je voor op problemen; gebruik dus mysqli_set_charset($connect', 'utf8') direct na het verbinden en in een PHP-header of meta-tag voor je HTML-document
- ESCAPE je OUTPUT, bijvoorbeeld met de functie escape():
- zorg voor foutafhandeling (bijvoorbeeld in je database class) of (zoals in dit geval) geef netjes weer dat er fouten zijn opgetreden
- schrijf queries uit over meerdere regels
- gebruik (in PHP) enkele quotes waar je kunt en dubbele waar het niet anders kan
- zet (in HTML) altijd dubbele quotes om attributen
- definieer geen stijlen inline, maar verplaats deze naar een extern bestand:
Code (php)
1
2
3
4
5
6
2
3
4
5
6
body { background-color: #ffffff; }
#mainContainer { width: 560px; margin: 0 auto; overflow: auto; text-align: center; background-color: #000000; }
#mainContainer p { color: #ffffff; }
#titleContainer { color: #ffffff; }
.studentContainer { overflow: auto; }
.studentContainer div { float: left; width: 100px; padding: 10px; margin: 10px; background-color: #999999; }
#mainContainer { width: 560px; margin: 0 auto; overflow: auto; text-align: center; background-color: #000000; }
#mainContainer p { color: #ffffff; }
#titleContainer { color: #ffffff; }
.studentContainer { overflow: auto; }
.studentContainer div { float: left; width: 100px; padding: 10px; margin: 10px; background-color: #999999; }
- niet alle HTML elementen hoeven een klasse of div te hebben
Oftewel: houd het gewoon SIMPEL en KORT.
EDIT: zelfs met enige toevoegingen is het oorspronkelijke bestand geslonken van 80 naar 40 regels.
Gewijzigd op 15/04/2015 20:25:30 door Thomas van den Heuvel