CODEWITHSUNDEEP
phphtmlcsstemplates
Sam Braslavskiy
Sam Braslavskiy

Reputation: 1288

External CSS and JS files in MVC model

So, I'm trying to build a web site based on my own MVC-like PHP model.

let's say that every view consists of at least 2 parts:

let those be 'template.php' and 'mypage.php' (the second part depends on the specific page, the first part is common).

template.php has the following code (in simplified version):

<html>
<title>Sometitle</title>
<link rel='stylesheet' href='/css/gen.css' type='text/css' />
<script type='text/javascript' src='/js/gen.js'></script>
<?php echo $other_external_files; ?>
</head>
<body>
<div class="some_header_and other stuff">...</div>
<div class="workfield">
<?php include_once mypage.php; ?>
</div>
</body>
</html>

The problem that 'mypage.php' (as well as some other pages) has some specific .css and .js files that should be included.

The question is: Which is the best option to include these files (how and where)?

Here are my thoughts:

  1. I could define the variable $other_external_files in a model or controller, but don't really want to do that, because .css file is normally part of the view and I could hardcode it in 'mypage.php', if only it would not need to stay in <head>.

  2. I understand that .css and .js files can be dynamically included with JavaScript, but I'd like to avoid this solution if there's no strong need in it.

  3. I could define all these variables in the corresponding models. The problem here is, that from the very beginning I've been trying to structure my models based on the content (thus, I have universal models (files and Classes) like 'Users', 'Shop_items' etc, that don't necessarily correspond to every view file (it means I basically don't have any mypage_model.php, just 'items_model', 'users_model' etc.). Defining title of the page in a model will force me to add lots of model files.

  4. I could possibly auto-define the variable $other_external_files in the core View class, like this:

-

function __construct($action){
$this->action = $action.'.php';
$this->css_file = 'css/'.$action.'.css';
}

function generate($view_lvl, $data = null){
$other_external_files = $this->css_file;
require_once $action;
}

However, this approach seems to be limited, because possibly there can be a situation, when I'd like to include several files with quite different names.

My personal choose for now is the 3rd., because it allows not only to append css and js, but also easily define title of the document and other possible variables... but before multiplying my files, I'd like to consult experienced programmers you are if it's really the right way.

Thanks a lot and sorry for a long question. Any help is very much appreciated!

Upvotes: 2

Views: 5009

Answers (1)

MahanGM
MahanGM

Reputation: 2382

I usually don't go for this kind of formation. Experience has proven to me that if I separate each view/page as a single file, it'll be more useful. I always use your strategy for pages that they're more template like and when it comes to page's distinct properties like title I make it so strict to not get confused. For instance, I get those properties from a single place like a database table of pages.

For resources like JavaScript or CSS files I include them exactly like in a normal page in every view. I think it's better to not populate them in a variable like $other_external_files; and instead put them differently in each separated view.

For example, this is my about.php view:

<html>
<head>
<title>About</title>
<link rel='stylesheet' href='<?php echo ABS_PATH; ?>/css/extra.css' type='text/css' />
<link rel='stylesheet' href='<?php echo ABS_PATH; ?>/css/extra2.css' type='text/css' />
<script type='text/javascript' src='<?php echo ABS_PATH; ?>/js/extra.js'></script>
</head>
<body>
</body>
</html>

And this is my contact.php view:

<html>
<head>
<title>Contact</title>
<link rel='stylesheet' href='<?php echo ABS_PATH; ?>/css/extra3.css' type='text/css' />
<script type='text/javascript' src='<?php echo ABS_PATH; ?>/js/extra.js'></script>
<script type='text/javascript' src='<?php echo ABS_PATH; ?>/js/extra2.js'></script>
</head>
<body>
</body>
</html>

For my very dynamic page:

<html>
<head>
<title><?php echo $TITLE; ?></title>
<link rel='stylesheet' href='<?php echo ABS_PATH; ?>/css/extra3.css' type='text/css' />
<script type='text/javascript' src='<?php echo ABS_PATH; ?>/js/extra.js'></script>
<script type='text/javascript' src='<?php echo ABS_PATH; ?>/js/extra2.js'></script>
</head>
<body>
</body>
</html>

If you look at my dynamic page you see that I pass actual data to it. This means I get relevant data from my controller and then I pass it through.

Upvotes: 3

Related Questions