3. How to display a webpage using MVC?

Before you begin make sure to install XAMPP and Notepad++ or any text editor.

Projectname:BizjobFinder.com
Steps
1. On C:\xampp\htdocs, create the following folders as shown below:


MVC Framework-Folder Structure

2. Create file(s) to inside the folder specified below:
Folder-File(s)
bizjobfinder.com-index.php
model-jobseeker_model.php
view-jobseeker_signup_view.php
controllers-jobseekers.php
css-jobseeker_signup.css

3. On jobseeker_signup_view.php, type the following:
<html>
<head>
            <title>Jobseeker Signup | BizjobFinder</title>
            <link href='/bizjobfinder.com/css/jobseeker_signup.css' rel='stylesheet' type='text/css'>
</head>
<body>
<div><h4>Free Signup</h4></div>
<hr>
<form action="jobseekers.php?model=jobseeker-save" method="POST">
<div class='form-row'>
            <span class='label'>Firstname:</span>
            <input type='text' name='firstname'>
</div>
<div class='form-row'>
            <span class='label'>MI:</span>
            <input type='text' name='mi'>
</div>
<div class='form-row'>
            <span class='label'>Lastname:</span>
            <input type='text' name='lastname'>
</div>
<div class='form-row'>
            <span class='label'>Street/Barangay:</span>
            <input type='text' name='street_barangay'>
</div>
<div class='form-row'>
            <span class='label'>Town/City:</span>
            <input type='text' name='town_city'>
</div>
<div class='form-row'>
            <span class='label'>Province:</span>
            <input type='text' name='province'>
</div>
<div class='form-row'>
            <span class='label'>&nbsp;</span>
            <input type='submit' name='submit' value='Signup'>
</div>
</form>
</body>
</html>

4. On jobseeker_signup.css, type the following:
.form-row {padding:5px;}
.label {display:block;width:100px;float:left;text-align:right;margin-right:5px;}

SideNote: Notice the relationship of jobseeker_signup_view.php and jobseeker_signup.css
 <link href='/bizjobfinder.com/css/jobseeker_signup.css' rel='stylesheet' type='text/css'>
<div class='form-row'>
 <span class='label'>

5. On jobseekers.php, type the following:
<?php
/*
*Filename:jobseekers.php
*Projectname:BizjobFinder.com
*Date created:November 18, 2011
*Created by:Mario T. Silvano
*/
?>
<?php
            class jobseekers{                     
                        //views---------------
                        public function signup(){
                        return 'views/jobseeker_signup_view';
                        }
            }
           
            $obj=new jobseekers();
            $view='';
            //views---------------------
            if(!empty($_GET['view'])){
                        $view=$_GET['view'];
                        switch($view){
                                    case 'jobseeker-signup':
                                    $page=$obj->signup();
                                    break;
                        }
                        include $_SERVER['DOCUMENT_ROOT'].'/bizjobfinder.com/application/'.$page.'.php';   
            }
/*
*End of file: jobseekers.php
*Location: /application/controllers/jobseekers.php
*/          

6. On index.php please type the following:
<html>
<head>
            <title>Home | BizjobFinder</title>
</head>
<body>
<a href='application/controllers/jobseekers.php?view=jobseeker-signup'>Jobseeker Signup</a>
</body>
</html>


7. On your browser, type the following:
http://localhost/bizjobfinder.com/




No comments:

Post a Comment