Page 1 of 1

Code separation Rate Topic: ****- 7 Votes

#1 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3030
  • View blog
  • Posts: 10,553
  • Joined: 08-August 08

Posted 03 November 2010 - 07:19 PM

*
POPULAR

Everyone seems to agree that mixing php, html, css, and javascript in one file is a recipe for trouble, but few agree on the best way to keep them separated. Browse the questions in the php forum at any time and you're likely to find that most of the people who can't figure out where their code went wrong have a heavy mixture of php and html. This is why I've put together this little demonstration of a few ways to keep them apart.

What this does NOT do

I'm not trying to show the best way to layout a page or even make it look pretty. The css is basic and the values are chosen mostly to make clear the difference between one element and another. Even the html is simple, with no forms or anything else that could be interactive. They can be incorporated, but I wanted to keep this demostration simple.

What this DOES

First separation method
The first method reads a text file directly into an array. Since my text file has 3 lines, I choose between them and place the results in the array I'll be using to insert contents into the html to be sent to the browser.

Second separation method
This method prepares for the insertion of an entire file into the html by reading a file as text instead of an array.

Third method
This method uses an array or a variable to hold text/html. While it can be useful, it also provides the least separation (and is least desirable) since you're basically wrapping a chunk of html inside quotes in your php code.

You may have noticed that I added the css at the end, but it's one of the first items to be replaced in the example.html file. That's fine because I've kept the $replace array and the $with array in sync: Item number N in $replace is replaced with item number N in $with by str_replace().

So which is best, and are there others?
There are probably other ways, but these are easy to do and they're easy to manage. The best one is the one that works best for you and what you're doing. You might use any combination of them.

Attached File(s)



Is This A Good Question/Topic? 21
  • +

Replies To: Code separation

#2 Creecher  Icon User is offline

  • I don't care
  • member icon

Reputation: 561
  • View blog
  • Posts: 2,049
  • Joined: 06-March 10

Posted 01 February 2011 - 07:03 AM

I use a method where I create a PHP file for nothing but homemade functions.


For example, on my website I have a functions.php file for functions (of course).

Here's an example of one of the functions:

function ShowMenu()
{
	echo'<div id="left">
<div class="navouter">
<div class="orange"></div>
<div class="navheader">Main Menu</div>
<div class="navcontent">
<ul>
<li><a href="/index.php">Home</a></li>
</ul>
Stuff
<ul>
<li><a href="/index.php?id=about">About</a></li>
<li><a href="/index.php?id=projects">Projects</a></li>
<li><a href="/index.php?id=contact">Contact</a></li>
<li><a href="/index.php?id=downloads">Downloads</a></li>
</ul>
</div>
</div>
<div class="navouter">
<div class="orange"></div>
<div class="navheader">Friends</div>
<div class="navcontent">
<ul>
<li><a href="http://exile-studios.com" target="_BLANK">Exile Studios</a></li>
</ul>
</div>
</div>
</div>';
}



I then include the functions.php page into my PHP page using include.

<?php include'functions.php'; ?> 




And where I want to display my menu in my page, I just call in the function.
ShowMenu(); 
echo('</div>');



This may not be everyone's favorite method (or the most efficient??), but it is my favorite and it seems to work well for me.
Was This Post Helpful? 0
  • +
  • -

#3 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3030
  • View blog
  • Posts: 10,553
  • Joined: 08-August 08

Posted 27 February 2011 - 08:50 AM

*
POPULAR

I've had a question or two about how to do this, and at least one person new to php has shown me they were confused even after reading the above, so I'm going to try to explain further:

Beginners
If you want to write clean code, start by writing an all html page and saving that to an html file. NO php at all, so if you were to load that into a browser it would be a complete, but static page. Next, write a php script that reads in the html file and makes a change to it before sending it to the browser. Functions like str_replace and preg_replace can be used for this. Simple so far, right? Well, the rest just builds on this simple concept.

Imagine I have a page that will be identical for all users with the exception that admin users will see a different form with more capabilities offered to them. A typical beginner would need to use two different pages, both with different php mixed in with different html. Can you see how that would be a nightmare to maintain? Using my method, you would have one main html file with a string or a tag in it (such as "PHPFORM") that can be replaced with the entire contents of a form, which itself can be in a separate file. There could be one form for normal users and another for admins, and all the php needs to do is decide which to use. All three of these files would be strictly html, so each would be easy to edit. So would the php, because it would be short and simple, with no html to confuse you.


More advanced coders
You may not be a beginner and so you're wondering how any of this might apply to your code, which uses MVC in an OOP based framework. You've got your view class set up, and you're comfortable editing your own code. The question is, are others? Do you work with graphic designers who need to be able to change the html, but can't always do so without your help? Wouldn't it be better to remove all html from your view code and place it in html files they could edit freely? Then your view code could do the logic it needs to do without getting in their way.
Was This Post Helpful? 7
  • +
  • -

#4 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3030
  • View blog
  • Posts: 10,553
  • Joined: 08-August 08

Posted 27 July 2011 - 07:53 AM

In this topic codeprada uses the DOMDocument to manipulate HTML. I don't know why I hadn't thought of doing that, but here's an example based on codeprada's.
PHP:
<?php
//click any link and enjoy
ini_set('display_errors', false); //sometimes we get invalid HTML but you should handle the errors instead of hiding
$url = "homepage.html"; //our target url
$target_urls = file("target_urls.html");
$num_targets = count($target_urls);
for($i = 0; $i < $num_targets-1; $i++) {
	$target_urls[$i] = substr($target_urls[$i], 0, -1); // Remove line feeds.
}
$dom = new DOMDocument();
$dom->loadHTML(file_get_contents($url)); //send the html to our dom
$target_num = 0;
foreach($dom->getElementsByTagName('a') as $a) //for each link (<a></a>)
{
	if($target_num < $num_targets) {
		$a->attributes->getNamedItem('href')->nodeValue = $target_urls[$target_num]; //set the value of the href attribute to whatever we want
	} 
	$target_num++;
}
echo $dom->saveHTML(); //echo to screen
?>

homepage.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Welcome to My Little Example</title>
</head>
<body>
<a href="www.somedefaultpage.com" >First page</a><br />
<a href="www.somedefaultpage.com" >Second page</a><br />
<a href="www.somedefaultpage.com" >Third page</a><br />
<a href="www.somedefaultpage.com" >Fourth page</a><br />
<a href="www.somedefaultpage.com" >Fifth page</a><br />
</body>
</html>

target_urls.html
www.cnn.com
www.usatoday.com
www.dreamincode.net

Was This Post Helpful? 3
  • +
  • -

#5 kiasta  Icon User is offline

  • D.I.C Regular

Reputation: 20
  • View blog
  • Posts: 258
  • Joined: 18-November 07

Posted 14 November 2012 - 06:40 PM

This may be an old post, but I just had to say that it helped me out a lot. I was struggling with a way to efficiently create my view in MVC and remove html altogether. It's all starting to make more sense now. Thanks!
Was This Post Helpful? 1
  • +
  • -

Page 1 of 1