Passing data from PHP to JavaScript

Question

I have a simple php variable i need to carry over to a javascript part.

Code:

<?php
if ($p == 'home') { $selected == '0'; }
if ($p == 'music') { $selected == '1'; }
if ($p == 'videos') { $selected == '2'; }
if ($p == 'search') { $selected == '3'; }
if ($p == 'about') { $selected == '4'; }
if ($p == 'contact') { $selected == '5'; }
?>
<script type="text/javascript">
//SYNTAX: tabdropdown.init("menu_id", [integer OR "auto"])
tabdropdown.init("colortab", $selected) <-- $selected is the variable I want to carry over
</script>

Answer 1

It is the same as any other piece of text.

tabdropdown.init("colortab", <?php echo $selected; ?>)

Since the value is one of a set of known values which are all numbers, it doesn't need escaping or quoting.

Answer 2

First of all

<?php

$map = array(
   'home' => 0,
   'music' => 1,
   'videos' => 2,
   'search' => 3,
   'about' => 4,
   'contact' => 5 
);

$selected = $map[$p];

?>

And i would recommend to just use some variable, like:

?>
<script type="text/javascript">
var data = { /*something that you want to pass to the script */ };
</script>
<?php

And then, lower, when you include your external JS files ( they should be right before closing tag ), you can check within the files if variable data is set. And then act upon that data.

Answer 3

Although the above solutions will help, it required you having JavaScript embedded your HTML/PHP file (which, granted you do have).

If you have a separate js file then you will need to take a different approach.

Store it in a hidden HTML variable:

<input type="hidden" id="ColorTabSelected" value="<?php echo($selected);?>">

Then in your js

var selected = document.getEelementById("ColorTabSelected").value;
tabdropdown.init("colortab", selected);

In general, I find this approach preferable anyway, it promotes separation and means that you don't have a executable module of code that is changeable and dynamic. This means you can isolate it effectively for unit testing.

Answer 4

<?php
$p = 'home';
$map = array(
    'home' => '0',
    'music' => '1',
    'videos' => '2',
    'search' => '3',
    'about' => '4',
    'contact' => '5'
);
$selected = isset($map[$p]) ? $map[$p] : $map['home'];
?>
<script type="text/javascript">
tabdropdown.init("colortab", <?=$selected?>)
</script>

Answer 5

Try with:

<?php $yourVar = "hello"; ?>
<script>
 var yourVar = "<?php echo $yourVar ?>"
</script>