How to pass PHP array parameter to Javascript Function?

Question

index.php

<script type="text/javascript" src="javascript.js"> </script>
<?php
 $movies = array("Bloodsport", "Kickboxer", "Cyborg", "Timecop", "Universal Soldier", "In Hell", "The Quest");
?>

<input type="submit" value="Test Javascript" onclick="showMovies(<?php echo $movies; ?>);" />

javascript.js

function showMovies(movies) {
 alert(movies.length);

 return false;
}

I am new to programming so Im having hard time fixing this one which is obviously simple for you guys.

When I hit the submit button it says the that the array size is 1 which I think should be 7. How could this be?

Look at the HTML/Javascript that this produces in your browser (View Source). — deceze
– deceze ♦, Commented Jun 28, 2011 at 5:48

Bill the Lizard · Accepted Answer · 2011-06-28 15:09:39Z

10

<input type="submit" value="Test Javascript" onclick='showMovies(<?php echo json_encode($movies); ?>);' />

Notice the json_encode, which encodes objects or arrays for Javascript (JSON stands for JavaScript Object Notation) and also notice the ' instead of ", because JSON uses ".

Although, this soulution would be better:

<script type="text/javascript">
    document.getElementByID('submitButton').onclick = function() {
        var movies = <?php echo json_encode($movies); ?>;
        showMovies(movies);
    };
</script>
...
<input type="submit" value="Test JavaScript" id="submitButton">

edited Jun 28, 2011 at 15:09

Bill the Lizard

407k213 gold badges579 silver badges892 bronze badges

answered Jun 28, 2011 at 5:51

Florian

3,2011 gold badge29 silver badges39 bronze badges

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

2 Comments

Son of Man Over a year ago

You mean I have to mix my javascript with my php code??? I want to separate them... Pls help I am a beginner...

Atul Over a year ago

notice the ' instead of ", because JSON uses " >> This line works for me ...thanks

Gaurav Porwal · Accepted Answer · 2011-06-28 07:24:03Z

4

Try this

PHP Code

<script type="text/javascript" src="javascript.js"> </script>
<?php
  $movies = array("Bloodsport", "Kickboxer", "Cyborg", "Timecop", "Universal Soldier", "In Hell", "The Quest");
  $mov_str = implode(",", $movies);
?>

<input type="submit" value="Test Javascript" onclick="showMovies('<?php echo $mov_str; ?>');" />

In Javascript File

function showMovies(movies) {
  movies = movies.split(",");
  alert(movies.length);
 return false;
}

Output

I hope this will help you.

answered Jun 28, 2011 at 7:24

Gaurav Porwal

5134 silver badges6 bronze badges

Comments

Ignacio Vazquez-Abrams · Accepted Answer · 2011-06-28 05:48:19Z

2

Encode as JSON before outputting.

<input type="submit" value="Test Javascript" onclick="showMovies(<?php echo json_encode($movies); ?>);" />

answered Jun 28, 2011 at 5:48

Ignacio Vazquez-Abrams

804k160 gold badges1.4k silver badges1.4k bronze badges

14 Comments

Son of Man Over a year ago

what is json??? Is that something built-in in native javascript or is that a plugin I need to install?

Joel Over a year ago

Wow, Ignacio, that was rude. @Son of Man: You can do a quick search on Google for "JSON" to get a good idea of what JSON is.

Ignacio Vazquez-Abrams Over a year ago

Rude is expecting someone else to do all the research for you.

ErikE Over a year ago

Rude is treating honest ignorance as maliciousness.

ErikE Over a year ago

Read my answer. It goes deeper than that.

|

Community · Accepted Answer · 2017-05-23 12:25:55Z

1

Your PHP variables only live on the server. They are completely separate from the JavaScript variables on the client. The only mechanism for passing values from the server to the client is through the contents of the web page (or through specially requested behind-the-scenes web content through AJAX).

This means that to make your JavaScript receive PHP values, you have to write JavaScript with those values embedded inside of it. You must mix the PHP with the JavaScript at least a tiny bit to get the stuff that runs on the client to have any data from the server.

This is how all web server-side scripting works in all languages.

JavaScript simply cannot know what goes in your movies variable unless you stuff it full of values, in JavaScript.

I recommend you to @levu's answer to see a good way to get your PHP variable's values into JavaScript.

edited May 23, 2017 at 12:25

CommunityBot

11 silver badge

answered Jun 28, 2011 at 6:16

ErikE

50.7k23 gold badges157 silver badges201 bronze badges

5 Comments

Ignacio Vazquez-Abrams Over a year ago

It is perfectly valid to generate JavaScript code via PHP, which is what is being done in the question.

ErikE Over a year ago

Of course. The JS can be in a separate file or in the HTML returned from the PHP script. But the actual values have to be encoded in JS in some place where JavaScript is expected, like an event attribute or a script tag. You can't actually put JavaScript in PHP or vice versa because neither would execute. You have to switch back and forth appropriately.

ErikE Over a year ago

@Ignacio if you really thought you had to explain to me that you "can generate JavaScript via PHP" then you are really not getting it! Trust me, the way I explained it is what the OP needs. @son do you have any input for us?

Ignacio Vazquez-Abrams Over a year ago

Where does the value of the variable ever change?

ErikE Over a year ago

@Ignacio what are you talking about? If you want to change a variable's value, do so. If you want the client to change data on the server, GET or POST and read the data.

Rukmi Patel · Accepted Answer · 2011-06-28 11:38:41Z

1

You can pass array in js by json_encode() php function.. json_encode() will make array into string. you can get array back by saprating that string in js.

answered Jun 28, 2011 at 11:38

Rukmi Patel

2,5619 gold badges29 silver badges42 bronze badges

Comments

Bill the Lizard · Accepted Answer · 2011-06-28 16:52:26Z

1

<?php
  $movies = array("Bloodsport", "Kickboxer", "Cyborg", "Timecop", "Universal Soldier", "In Hell", "The Quest");
  $str=implode(",",$movies);
?>
<script type="text/javascript" >
  var arr=new Array();
  var str="<?php echo $str; ?>";
  arr=str.split(',');
  //alert(arr.toSource());
  function showMovies(movies) {
    alert(movies.length);
    return false;
  }
</script>

<input type="submit" value="Test Javascript" onclick="showMovies(arr)" >

Hey Please use above for your desired result. It is tested code.

edited Jun 28, 2011 at 16:52

Bill the Lizard

407k213 gold badges579 silver badges892 bronze badges

answered Jun 28, 2011 at 6:40

shankar kumar

112 bronze badges

Comments

5442224 · Accepted Answer · 2012-11-05 10:27:13Z

0

You can also parse an array for JavaScript with json_encode()

$array = array('1','a','b');

echo '<script type="text/javascript">';
echo 'var x = ' . json_encode($array) . ';';
echo '</script>';

This also works for associative arrays:

$array = array("x" => '1',"y" => 'a',"z" => 'b');
echo '<script type="text/javascript">';
echo 'var x = ' . json_encode($array) . ';';
echo '</script>';

answered Nov 5, 2012 at 10:27

5442224

736 bronze badges

Collectives™ on Stack Overflow

How to pass PHP array parameter to Javascript Function?

7 Answers 7

2 Comments

Comments

14 Comments

5 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

2 Comments

Comments

14 Comments

5 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related