Difference between revisions of "DesignPatternStep5"
From mi-linux
Jump to navigationJump to searchLine 1: | Line 1: | ||
[[Main Page]] >> [[6CC001|Advanced Web Technologies]] >> [[6CC001 - Workbook|Workbook]] >> [[6CC001 Workshop - week 04|Week 04]] >> Step 5 - Creating our first view | [[Main Page]] >> [[6CC001|Advanced Web Technologies]] >> [[6CC001 - Workbook|Workbook]] >> [[6CC001 Workshop - week 04|Week 04]] >> Step 5 - Creating our first view | ||
+ | |||
+ | == Step 5 - Creating our first view == | ||
+ | |||
+ | All we need now is to pass the data above to a view. Let's create all our views in a "views" sub-folder. | ||
+ | <pre><!-- views/index.php --> | ||
+ | |||
+ | <?require_once("ViewHelper.php");?> | ||
+ | |||
+ | <?ViewHelper::DisplayHeader("Blog index");?> | ||
+ | |||
+ | <h1>Blog index</h1> | ||
+ | |||
+ | <p>You can <a href="index.php?cmd=BlogAddForm">add messages</a> !</p> | ||
+ | |||
+ | <form action="index.php" method="post"> | ||
+ | Search: <input name="search"> | ||
+ | <input type="submit" value="Search!"> | ||
+ | </form> | ||
+ | |||
+ | <? | ||
+ | foreach($data as $message) | ||
+ | echo("<div class=\"message\"> | ||
+ | <h2>{$message['title']}</h2> | ||
+ | <p>{$message['message']}</p> | ||
+ | <a href=\"index.php?cmd=BlogDelete&id={$message['id']}\">Delete this message</a> | ||
+ | </div>"); | ||
+ | ?> | ||
+ | |||
+ | <?ViewHelper::DisplayFooter();?></pre> | ||
+ | The code itself it pretty simple. It loops through the data array using a foreach statement. | ||
+ | |||
+ | Note that instead of duplication the <HEAD> section in all our views, we have decided to move it to a helper function. All our views can then include the helper file and call the DisplayHeader and DisplayFooter function: | ||
+ | <pre>// views/ViewHelper.php | ||
+ | |||
+ | //############################################################################ | ||
+ | // ViewHelper | ||
+ | //############################################################################ | ||
+ | class ViewHelper | ||
+ | { | ||
+ | //############################################################################ | ||
+ | // Displays HTML Header | ||
+ | //############################################################################ | ||
+ | static function DisplayHeader($pageTitle = "") | ||
+ | { | ||
+ | echo("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">"); | ||
+ | echo("<html>"); | ||
+ | echo(" <head>"); | ||
+ | echo(" <title>{$pageTitle}</title>"); | ||
+ | echo(" <link type=\"text/css\" href=\"views/style.css\" rel=\"stylesheet\">"); | ||
+ | echo(" </head>"); | ||
+ | echo(" <body>"); | ||
+ | } | ||
+ | |||
+ | //############################################################################ | ||
+ | // Displays HTML Footer | ||
+ | //############################################################################ | ||
+ | static function DisplayFooter() | ||
+ | { | ||
+ | echo(" </body>"); | ||
+ | echo("</html>"); | ||
+ | } | ||
+ | }</pre> | ||
+ | All you need now is to include your view from your command: | ||
+ | <pre>// Command_BlogIndex.php | ||
+ | |||
+ | //############################################################################ | ||
+ | // doExecute | ||
+ | //############################################################################ | ||
+ | function doExecute(Request $request) | ||
+ | { | ||
+ | // Create manager object | ||
+ | $manager = new ManagerMessage(); | ||
+ | |||
+ | // Get data from database object | ||
+ | $data = $manager->getAllMessages(); | ||
+ | |||
+ | // Include view | ||
+ | include("views/index.php"); | ||
+ | }</pre> | ||
+ | Note: I'll let you create your own style sheet, mine is boring anyway :) | ||
+ | |||
+ | === Checkpoint === | ||
+ | |||
+ | The home page of your blog should now be working!!! | ||
+ | |||
+ | [[Image:Blog.gif|Image:blog.gif]] |
Revision as of 15:45, 12 July 2011
Main Page >> Advanced Web Technologies >> Workbook >> Week 04 >> Step 5 - Creating our first view
Step 5 - Creating our first view
All we need now is to pass the data above to a view. Let's create all our views in a "views" sub-folder.
<!-- views/index.php --> <?require_once("ViewHelper.php");?> <?ViewHelper::DisplayHeader("Blog index");?> <h1>Blog index</h1> <p>You can <a href="index.php?cmd=BlogAddForm">add messages</a> !</p> <form action="index.php" method="post"> Search: <input name="search"> <input type="submit" value="Search!"> </form> <? foreach($data as $message) echo("<div class=\"message\"> <h2>{$message['title']}</h2> <p>{$message['message']}</p> <a href=\"index.php?cmd=BlogDelete&id={$message['id']}\">Delete this message</a> </div>"); ?> <?ViewHelper::DisplayFooter();?>
The code itself it pretty simple. It loops through the data array using a foreach statement.
Note that instead of duplication the <HEAD> section in all our views, we have decided to move it to a helper function. All our views can then include the helper file and call the DisplayHeader and DisplayFooter function:
// views/ViewHelper.php //############################################################################ // ViewHelper //############################################################################ class ViewHelper { //############################################################################ // Displays HTML Header //############################################################################ static function DisplayHeader($pageTitle = "") { echo("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">"); echo("<html>"); echo(" <head>"); echo(" <title>{$pageTitle}</title>"); echo(" <link type=\"text/css\" href=\"views/style.css\" rel=\"stylesheet\">"); echo(" </head>"); echo(" <body>"); } //############################################################################ // Displays HTML Footer //############################################################################ static function DisplayFooter() { echo(" </body>"); echo("</html>"); } }
All you need now is to include your view from your command:
// Command_BlogIndex.php //############################################################################ // doExecute //############################################################################ function doExecute(Request $request) { // Create manager object $manager = new ManagerMessage(); // Get data from database object $data = $manager->getAllMessages(); // Include view include("views/index.php"); }
Note: I'll let you create your own style sheet, mine is boring anyway :)
Checkpoint
The home page of your blog should now be working!!!