How can I pass a PHP array as an argument to a JavaScript function

Question

It's just an example, but with this code, it works. But if I change 5 to "5" and 10 to "10" I got an Unexpectid ending syntax error for the echo line

PHP

$array = array();
$array[0] = 10;  
$array[1] = 5; 
$json = json_encode($array);

echo "<td style=\"background: red;\"><button onclick=\"modifyModalContent('$day_date_column','$i',$json) ... (really long line)

JS

function modifyModalContent(date, id, array) {
  var header = document.querySelector(".modal-header");
  var body = document.querySelector(".modal-body");

  var table =
  `
  <table class="table table-bordered table-hover">
    <tr>    
      <td>${array[0]}<td>
      <td>${array[1]}<td>
    </tr>
  </table>
  `;

  body.innerHTML = table;

  header.innerHTML = `<h1> Date: ${date}</h1></br><h1>ID: ${autoid}</h1>`;
}

The two echo line after run:

That works:

<tr style="height: 137px;"><td style="background: red;"><button onclick="modifyModalContent('2019-01-21','1',[10,5])" ... (long line)

And if I use it with a string array got error on this:

<tr style="height: 137px;"><td style="background: red;"><button onclick="modifyModalContent(2019-01-21,1,["10","5"])" ... (long line)

How could I do the same with an array like this:

$array = array();
$array[0] = "10";  
$array[1] = "5";

I guess the problem is because of the " char, but How could I fix it?

Look at the output of the problem line, you have unescaped quotes in quotes, you need to escape them — Patrick Evans, Jul 15 '19 at 12:38
You can do `$json = str_replace('"', "'", json_encode($array));` — dWinder, Jul 15 '19 at 12:44
Possible duplicate of [How to properly escape quotes inside html attributes?](https://stackoverflow.com/questions/4015345/how-to-properly-escape-quotes-inside-html-attributes) — Sayed Mohd Ali, Jul 15 '19 at 12:49

score 3 · Accepted Answer · answered Jul 15 '19 at 12:40

I'd recommend using the PHP function htmlspecialchars -- that will not only take care of issues with quotes, but any other characters (&, <, >} that should be turned into HTML entities before being used as HTML attribute values.

$json = htmlspecialchars(json_encode($array));

score 1 · Answer 2 · answered Jul 15 '19 at 12:35

1

Replace ["10","5"] with ['10','5']

More information about simple and double quotes: When to use double or single quotes in JavaScript?

answered Jul 15 '19 at 12:35

Guerric P

28,450
6
38
76

The array is in a variable, I call it like modifyModalContent('$day_date_column','$i',$json). Can I change the " to ' in that $json array ? – AME Jul 15 '19 at 12:37
Yes you can do it with PHP – Guerric P Jul 15 '19 at 12:40

How can I pass a PHP array as an argument to a JavaScript function

2 Answers2