Login

05-18-2009, 10:51 PM

[eluser]Fielder[/eluser]
I've got a common header (and footer) that is called on every page view from various controllers within my webapp. The code snippet below just happens to be for inserting new businesses form.

Code:
$this->load->view('include/header.php', $data);

$this->load->view('business_new');

$this->load->view('include/footer.php');

But the header and footer are the same everywhere.
My header now contains numerous .css and .js files that are not necessarily used in every view, but they're being called and loaded anyways.

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

&lt;html &gt;

&lt;head&gt;

    &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;

    &lt;title&gt;&lt;?=$title; ?&gt;&lt;/title&gt;

    &lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?=base_url(); ?&gt;assets/css/reset.css" /&gt;

    &lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?=base_url(); ?&gt;assets/css/text.css" /&gt;

    &lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?=base_url(); ?&gt;assets/css/1000_20_10_10.css" /&gt;

    &lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?=base_url(); ?&gt;assets/css/grid.css" /&gt;

    &lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?=base_url(); ?&gt;assets/css/jquery.treeview.css" /&gt;

    &lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?=base_url(); ?&gt;assets/css/jquery.autocomplete.css" /&gt;

    &lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?=base_url(); ?&gt;assets/css/default.css" /&gt;

    <scrpt type="text/javascript" src="&lt;?=base_url(); ?&gt;assets/js/jquery-1.3.2.min.js"></scrpt>            &lt;!--- jquery release ---&gt;

    <scrpt type="text/javascript" src="&lt;?=base_url(); ?&gt;assets/js/jquery.js"></scrpt>                        &lt;!--- application jquery ---&gt;

    <scrpt type="text/javascript" src="&lt;?=base_url(); ?&gt;assets/js/jquery.validate.js"></scrpt>            &lt;!--- form validation plugin ---&gt;

    <scrpt type="text/javascript" src="&lt;?=base_url(); ?&gt;assets/js/jquery.maskedinput-1.2.2.js"></scrpt>    &lt;!--- form masked input plugin ---&gt;

    <scrpt type="text/javascript" src="&lt;?=base_url(); ?&gt;assets/js/jquery.cookie.js" ></scrpt>                &lt;!--- cookie plugin for treeview menu navigation ---&gt;

    <scrpt type="text/javascript" src="&lt;?=base_url(); ?&gt;assets/js/jquery.treeview.js" ></scrpt>            &lt;!--- treeview menu navigation plugin ---&gt;

    <scrpt type='text/javascript' src="&lt;?=base_url(); ?&gt;assets/js/jquery.ajaxQueue.js"></scrpt>            &lt;!--- input autocomplete plugin - to prevent conflicting ajax requests ---&gt;

    <scrpt type='text/javascript' src="&lt;?=base_url(); ?&gt;assets/js/jquery.autocomplete.js"></scrpt>        &lt;!--- input autocomplete plugin ---&gt;

    <scrpt type='text/javascript' src="&lt;?=base_url(); ?&gt;assets/js/localdata.js"></scrpt>                    &lt;!--- input autocomplete localdata for plugin - need to eliminate ---&gt;

&lt;/head&gt;

&lt;body&gt;

ignore the <scrpt> and </scrpt> misspelling, CI forum removed my line of code where it was script

I've got even more .js files to load for various other pages, but is there a better way of doing this? I imagine always loading these .js files when they are not needed is inefficient.
Perhaps I can define the scripts needed in the controller array variable ($data), pass them into the view and just call a single $script_array variable to output them all into the html head?

Code:
$data['script_array'] = '<scrpt type="text/javascript" src="$base_url()"/assets/js/jquery-1.3.2.min.js"></scrpt><scrpt type="text/javascript" src="$base_url()"/assets/js/jquery.js"></scrpt>';

Any other good standard practices you guys use?
Thanks.