include javascript file based on the URL

Question

i have an application in which i have created a header.php which is obviously common for all the pages in the app which i include on top of every other page. This header file contains the html head tags and DOCTYPE declaration etc and some common JS and CSS files needed for every page. But there are some specific files which i want to include depending on the page.

Now, how do i include a specific JS or CSS file based on the url from which the header.php is requested.

I tried to use $_SERVER['PHP_SELF'] at the top of header file to fetch the url but it did not work.

Please suggest with the best technique that should be used in this situation.

Sample Code

header.php

 <?php
 include (dirname(__FILE__) . "/includes/functions.php");
 $url = $_SERVER['REQUEST_URI'];
  ?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>My APP</title>
<meta charset="utf-8" />
<meta name="robots" content="noodp, noydir" />
<meta http-equiv="X-Frame-Options" content="deny" />
<link rel="stylesheet" href="css/main.css" type="text/css" />
<script src="js/main.js"></script>
<?php
if($url == "teachers.php"){
echo "<script src='js/teachers.js'></script>";
   }  
?>

</head>
<body>

Do you request teachers.php in your browser? And how does that look? — Bart Friederichs
– Bart Friederichs, Commented Sep 5, 2013 at 7:08
Did you try to echo $url to see what it actually contains? — Bart Friederichs
– Bart Friederichs, Commented Sep 5, 2013 at 7:09
yes, i request teachers.php. Well, its has its own HTML code and on top i've included this header file — coder101
– coder101, Commented Sep 5, 2013 at 7:10

Bart Friederichs · Accepted Answer · 2013-09-05 07:17:57Z

3

The array you are looking for is the superglobal $_SERVER. It has all that info. More specifically: $_SERVER['REQUEST_URI'].

$_SERVER['REQUEST_URI'] gives the complete path, including slashes and any GET request. In your case (if teachers.php is in your server's root, and you don't GET anything), it will hold /teachers.php, and you are comparing against teachers.php.

$_SERVER['SCRIPT_FILENAME'] gets the executing script, which is what you seem to be looking for.

You could use basename to filter the path out:

$url = basename($_SERVER['SCRIPT_FILENAME']);

By the way, @hendyanto's solution is also good. It is certainly robust against filename changes.

edited Sep 5, 2013 at 7:17

answered Sep 5, 2013 at 6:59

Bart Friederichs

33.8k16 gold badges112 silver badges219 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

DevMetal91 Over a year ago

In my opinion, u create the array or object, like $css = array('uri' => array('css1.css', 'css2.css') ...) And make the function that load the spec css or js with the suggested request_uri property

coder101 Over a year ago

Well, its still not working. what i am doing is that on top of the header file before the DOCTYPE declaration i'm storing the request_uri array value in a variable and then based on that i'm trying to include the JS tag

Hendyanto · Accepted Answer · 2013-09-05 07:00:52Z

2

Create a variable on the page that will include header.php, later, check the variable inside the header.php to determine what to do.

Example

in home.php (sample page that will call header.php)

<?php
$page_code = "home";
include ("header.php");

/*Rest of your code*/

?>

in header.php

<?php
switch ($page_code) {
case 'home':
    echo "include js and css here..";
    break;

case 'profile':
    echo "include js and css here..";
    break;

default:
    # code...
    break;
}
?>

answered Sep 5, 2013 at 7:00

Hendyanto

3351 silver badge8 bronze badges

1 Comment

coder101 Over a year ago

thanks man, as @bart mentioned, ur code is indeed very robust.

Sunil Kumar · Accepted Answer · 2013-09-05 07:22:21Z

0

I don't know it's perfect or not, but i use it in my applications

anypage.php

<?php
$js= "path/jstoinclude.js";
include "header.php";
?>

in header.php

<?php
//your code
if(isset($js)){
echo "<script src='".$js."'></script>";
}
?>

in this way you can include separate js, css files to different pages

answered Sep 5, 2013 at 7:22

Sunil Kumar

1,3912 gold badges15 silver badges33 bronze badges

Collectives™ on Stack Overflow

include javascript file based on the URL

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related