|
|
(3 intermediate revisions by the same user not shown) |
Line 15: |
Line 15: |
| | | |
| Let's take it one step at a time... and remember: read and understand the code before pasting it into your text editor! | | Let's take it one step at a time... and remember: read and understand the code before pasting it into your text editor! |
− |
| |
− |
| |
− |
| |
− |
| |
− | == 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]]
| |
− |
| |
− | == Step 6 - Adding messages ==
| |
− |
| |
− | Next, let’s add a command to add blog messages. You might have noticed above that our “add messages” link (see above) points to “index.php?cmd=BlogAddForm”
| |
− |
| |
− | So first, you need a new command called “Command_BlogAddForm”. It doesn’t do much, it simply displays the view containing the form. Here is the code:
| |
− |
| |
− | <pre>
| |
− | // Command_BlogAddForm.php
| |
− |
| |
− | //############################################################################
| |
− | // SearchVenueCommand class
| |
− | //############################################################################
| |
− | class Command_BlogAddForm extends Command
| |
− | {
| |
− | //############################################################################
| |
− | // doExecute
| |
− | //############################################################################
| |
− | function doExecute(Request $request)
| |
− | {
| |
− | // Include view
| |
− | include("views/add_form.php");
| |
− | }
| |
− | }
| |
− | </pre>
| |
− |
| |
− | And here is the view containing the form:
| |
− |
| |
− | <pre>
| |
− | <!-- views/add_form.php -->
| |
− |
| |
− | <?require_once("view_helper.php");?>
| |
− |
| |
− | <?ViewHelper::DisplayHeader("Add message");?>
| |
− |
| |
− | <h1>Blog add form</h1>
| |
− |
| |
− | <p>Please fill in the fields</p>
| |
− |
| |
− | <form action="index.php?cmd=BlogAdd" method="post">
| |
− | Title:<br><input name="title">
| |
− | <br>
| |
− | Message:<br><textarea name="message"></textarea>
| |
− | <br>
| |
− | <input type="submit" value="Add">
| |
− | </form>
| |
− |
| |
− | <?ViewHelper::DisplayFooter();?>
| |
− | </pre>
| |
− |
| |
− | Again note that the "action" attribute of the <FORM> above points to "index.php?cmd=BlogAdd". So we need another action responsible for reading the user data from the form, and creating a new record in the database... here it is!
| |
− |
| |
− | <pre>
| |
− | // Command_BlogAdd.php
| |
− |
| |
− | //############################################################################
| |
− | // Command_BlogAdd class
| |
− | //############################################################################
| |
− | class Command_BlogAdd extends Command
| |
− | {
| |
− | //############################################################################
| |
− | // doExecute
| |
− | //############################################################################
| |
− | function doExecute(Request $request)
| |
− | {
| |
− | // Get data from request
| |
− | $title = $request->getProperty('title');
| |
− | $message = $request->getProperty('message');
| |
− |
| |
− | // Create manager object
| |
− | $manager = new ManagerMessage();
| |
− |
| |
− | // Add to database
| |
− | $manager->addMessage($title, $message);
| |
− |
| |
− | // Redirect to index
| |
− | header("location:index.php");
| |
− | }
| |
− | }
| |
− | </pre>
| |
− |
| |
− | Note: This action doesn't have a view. It simply redirects the user to the index of the forum.
| |
− |
| |
− | === Checkpoint ===
| |
− |
| |
− | You should now be able to add new messages... try it!
| |
− |
| |
− | == Step 7 - Deleting messages ==
| |
− |
| |
− | Finally, let’s create a new action in charge of message deletion.
| |
− |
| |
− | Again if you browse the mouse over the “delete this message” links, you will see URLs such as “index.php?cmd=BlogDelete&id=19”
| |
− |
| |
− | So we need a new Command_BlogDelete class. Here is the code:
| |
− |
| |
− | <pre>
| |
− | // Command_BlogDelete.php
| |
− |
| |
− | //############################################################################
| |
− | // SearchVenueCommand class
| |
− | //############################################################################
| |
− | class Command_BlogDelete extends Command
| |
− | {
| |
− | //############################################################################
| |
− | // doExecute
| |
− | //############################################################################
| |
− | function doExecute(Request $request)
| |
− | {
| |
− | // Get data from request
| |
− | $id = $request->getProperty('id');
| |
− |
| |
− | // Create manager object
| |
− | $manager = new ManagerMessage();
| |
− |
| |
− | // Add to database
| |
− | $manager->deleteMessage($id);
| |
− |
| |
− | // Redirect to index
| |
− | header("location:index.php");
| |
− | }
| |
− | }
| |
− | </pre>
| |
− |
| |
− | Nothing too complicated here...
| |
− |
| |
− | === Checkpoint ===
| |
− |
| |
− | You should now be able to delete messages.
| |
− |
| |
− | Note: It is always better practice to ask users to confirm deletion first... but you can do that bit ;)
| |