View en template
Het verschil tussen views en templates is dat een template het soort output bepaalt, dus html, json, xml en een view doet niets meer dan de data bij bewaren om dit als een soort pakketje in een template te gebruiken.
Bijvoorbeeld een html template:
En de view is dan een object met de data.
Is er ook voor elk soort output een aparte view klasse nodig?
Gewijzigd op 17/06/2014 15:28:24 door Mark Hogeveen
Hoe ik MVC ken, is dat er een request binnen komt. Aan de hand van de route van dit request wordt een controller met een bepaalde action aangeroepen. Deze action (in de controller dus) maakt niet een model, maar gebruikt een model. Uit het model wordt data opgehaald. Die data wordt teruggegeven aan de controller. De controller stuurt de data vervolgens naar de view. De view is een bestand met een stukje html. De variabelen worden in deze view verwerkt.
Ik dacht dat alleen templates html bevatten.
Wat betreft je vraag. Jij maakt zelf een model. Jij bent immers de programmeur. Dat model wordt vervolgens door de controller aangeroepen. Voorbeeld: er komt een verzoek binnen om product 123 te tonen. De controller vraagt dan aan het model de gegevens van product 123 op. Het model stuurt deze gegevens naar de controller en de controller geeft de gegevens door aan de view/template (dit kun je als hetzelfde beschouwen).
Harry hogeveen op 16/06/2014 22:59:47:
Het verschil tussen views en templates
Je kan niet spreken over een verschil tussen views en templates. Als we het hebben over het MVC dan is de view het gedeelte van je applicatie die zorg draagt voor het juist tonen van de gegevens. Daarvoor kan de view een template gebruiken, maar dat hoeft niet. De view kan de html ook volledig vanaf scratch opbouwen. Of, in geval van een ajax request, kan het ook zijn dat de view serverside alleen maar een rauwe json string doorstuurt en dat javascript clientside de rest doet.
Dat javascript deel zou je dan nog tot de view kunnen rekenen overigens, maar dat is een ander verhaal.
Ik neem als voorbeeld een administratie systeem dat ik ben aan het maken. De routes ernaartoe beginnen allemaal met /admin/
Als ik bijvoorbeeld /admin/user heb, dan kom je op de pagina van de user om instellingen te veranderen. Op die pagina staat aan de zijkant een menu, met daarin links als: wachtwoord, email, adres etc.
Als ik daarop klik (bv. op "wachtwoord") wordt de route: /admin/user/password
Dan krijg je een soort frame effect, de hele pagina blijft hetzelfde behalve dat ik er een nieuwe view in wil laten zien, het formulier om het wachtwoord te veranderen.
Ik wil dus niet voor elke view de header, footer en andere standaard dingen kopieren en in het view bestand zetten. Ik zou het liefst alleen de html van het wachtwoord formulier als een bestand willen opslaan en dat dan includen in de totale admin view. Begrijpen jullie?
Hoe doe je dit op een niet al te rommelige manier?
Gewijzigd op 19/06/2014 18:39:16 door Mark Hogeveen
Of je bouwt een standaard class voor de header en een standaard voor de footer die je voor elke pagina gebruikt. Die classes bouwen dan de html op (en dat kan weer vanaf scratch, of via een template).
De AdminUserController wordt gemaakt en de action page wordt aangeroepen. In die action methode heb ik nu iets als:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?php
public function page($page) {
$username = "Harry"; // van database
//...
$view = new View();
$view->set("username", $username);
// $page is in dit geval "password"
if($page == "password") {
$f = "views/password-form.php";
} else if($page == "email") {
$f = "views/email-form.php";
} else {
$f = "views/user-general.php";
}
$view->set("page", $f);
include "views/admin.php"; // De algemene totale pagina
}
?>
public function page($page) {
$username = "Harry"; // van database
//...
$view = new View();
$view->set("username", $username);
// $page is in dit geval "password"
if($page == "password") {
$f = "views/password-form.php";
} else if($page == "email") {
$f = "views/email-form.php";
} else {
$f = "views/user-general.php";
}
$view->set("page", $f);
include "views/admin.php"; // De algemene totale pagina
}
?>
De standaard view (met headers, footers, css, js, etc.) is bij mij nu:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<!-- html code -->
<!-- Hier wil ik het stuk met het wachtwoord formulier in hebben -->
<?php
include $view->get("page");
?>
<!-- html code -->
<!-- Hier wil ik het stuk met het wachtwoord formulier in hebben -->
<?php
include $view->get("page");
?>
<!-- html code -->
Gewijzigd op 19/06/2014 19:23:23 door Mark Hogeveen
Gewijzigd op 20/06/2014 21:31:43 door Mark Hogeveen
// in de controller
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?php
public function passwordAction() {
$username = "Harry"; // van database
$data = array(
'username' => $username,
);
$this->loadView('views/admin/password.php', $data)
}
public function emailAction() {
$username = "Harry"; // van database
$data = array(
'username' => $username,
);
$this->loadView('views/admin/email.php', $data)
}
?>
public function passwordAction() {
$username = "Harry"; // van database
$data = array(
'username' => $username,
);
$this->loadView('views/admin/password.php', $data)
}
public function emailAction() {
$username = "Harry"; // van database
$data = array(
'username' => $username,
);
$this->loadView('views/admin/email.php', $data)
}
?>
views/admin/password.php
Code (php)
views/admin/email.php
Code (php)
Toevoeging op 21/06/2014 10:40:21:
Bij template engines als Twig kun je delen van views overschrijven:
layout.html.twig
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
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
<?php
{% block stylesheets %}
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700' rel='stylesheet' type='text/css'>
{% endblock %}
{% block title 'Admin' %}
{% block body %}
<div class="page">
<nav>
<ul>
<li>
Home
</li>
<li>
About
</li>
</ul>
</nav>
<div class="content">
{% block content %} // <---------- Hier begint het blok 'content'
<p>Deze inhoud moet nog overschreven worden</p>
{% endblock %}
</div>
</div>
{% endblock %}
?>
{% block stylesheets %}
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700' rel='stylesheet' type='text/css'>
{% endblock %}
{% block title 'Admin' %}
{% block body %}
<div class="page">
<nav>
<ul>
<li>
Home
</li>
<li>
About
</li>
</ul>
</nav>
<div class="content">
{% block content %} // <---------- Hier begint het blok 'content'
<p>Deze inhoud moet nog overschreven worden</p>
{% endblock %}
</div>
</div>
{% endblock %}
?>
index.html.twig
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<?php
{% extends 'layout.html.twig' %}
{% block content %} // <----------- Hier overschrijven we de 'content blok' van layout.html.twig !!!
<h3>Welkom {{ username }}</h3>
{% endblock %}
?>
{% extends 'layout.html.twig' %}
{% block content %} // <----------- Hier overschrijven we de 'content blok' van layout.html.twig !!!
<h3>Welkom {{ username }}</h3>
{% endblock %}
?>
Gewijzigd op 21/06/2014 10:51:56 door Frank Nietbelangrijk