Can't pass PHP array to Javascript

Question

I have a json_encoded PHP array that I want to pass to Javascript:

$unmatched = json_encode(compareCourseNum($GLOBALS['parsed_courseDetails'], get_course_num_array($GLOBALS['bulletin_text'])));

$GLOBALS['unmatched'] = $unmatched;

print "<center><strong>Total number of courses parsed: $number_of_courses/" . "<span onClick=\"show_array(<?php echo $unmatched; ?>);\">" . count_courses($GLOBALS['bulletin_text']) . "</span>" . "</strong></center>";

Yet when I run the script, what is printed is this:

Total number of courses parsed: 98/);">108

And the Javascript doesn't work either. What should be printed is this:

Total number of courses parsed: 98/108

And the Javascript should work when I click on "108," by showing an alert of the elements of the array.

How can I fix this?

Here is the Javascript:

function show_array (array) {

    //var array = <?php echo $unmatched; ?>;
    alert();
    var result = "",
        length = array.length;
    for (var i = 0; i < length; ++i) {
        result += array[i] + "\n";
    }
    alert(result);
}

UPDATE: I removed the php tags and semicolon so it is now

"<span onClick="show_array( $unmatched);">"

But show_array is still not running! When I look at the Page Source, I see this:

"<span onClick="show_array( ["220","221","242E","249B","250","254","255","256","256S","272A","285"]);">"

Help please? I know it is not something wrong with the code of show_array, but with the array input, because when I pass a numerical array like [133, 234, 424] it works but not with string ones.

UPDATE2:

Okay, I managed to make the Javascript work by replacing the double quotes in the json_encoded array with single quotes:

$unmatched = str_replace('"', '\'', $unmatched);

But I don't understand why I needed to do that.

A php array is not a javascript array. You should consider changing your `show_array()` onclick event to include a `json_encode()`. — Lance, Sep 17 '13 at 23:29
I belive var name1 = val1, name2 = val2 ... ; is correct syntax. http://stackoverflow.com/questions/694102/declaring-multiple-variables-in-javascript — Gary Greenhorn, Sep 17 '13 at 23:56
Your first approach (now commented out) of simply echoing out the json_encoded array such as to make a javascript literal is probably the best — Mike Brant, Sep 18 '13 at 00:18

score 1 · Answer 1 · answered Sep 17 '13 at 23:33

1

This

...onClick=\"show_array(<?php echo $unmatched; ?>);\">" . count_courses($GLOBALS['bulletin_text']) . "</span>" . "</strong></center>";

should be

...onClick='show_array($unmatched);'>" . count_courses($GLOBALS['bulletin_text']) . "</span>" . "</strong></center>";

that is remove the opening an closing php tags and the semicolon, you're already in php parsing mode.

answered Sep 17 '13 at 23:33

Musa

89,286
16
105
123

I tried that, but I still don't get an alert message when I click on "108," meaning show_array() isn't running. Here is the span in the Page Source after this modification: "" – Gary Greenhorn Sep 17 '13 at 23:38
@GaryGreenhorn notice the single quotes around show_array, if you want to use `"` then you'll have to html encode the json also. – Musa Sep 18 '13 at 00:32
@GaryGreenhorn the `"` quoting the strings in the array will close the onclick attribute. – Musa Sep 18 '13 at 01:13

score 1 · Accepted Answer · answered Sep 18 '13 at 00:54

1

You can try using JSON_NUMERIC_CHECK as the second parameter in json_encode()(Requires PHP >= 5.3.3).

Another option is using parseInt() in JavaScript:

result += parseInt(array[i], 10);

answered Sep 18 '13 at 00:54

score 0 · Answer 3 · answered Sep 18 '13 at 00:17

The html below has two important sections. The first one shows minimal php, and mostly literal markup. The second has a php wrapper around the entire content of the first one.

I replaced some code with literals for simplicity.

<html>
  <head>
    <script>
      function show_array (array) {
        var result = "",
        length = array.length;
        for (var i = 0; i < length; ++i) {
          result += array[i] + "\n";
        }
        alert(result);
      }
    </script>
  </head>
  <body>
    <?php $unmatched = json_encode(array(1,2,3,4,5)); ?>

    <!-- Minimal php, only to pass the php array to JavaScript. -->
    <center><strong>
      Total number of courses parsed: 
      <span onClick="show_array(<?php echo $unmatched ?>)">
        15
      </span>
    </strong></center>

    <!-- Wrapper in php. 
         1. Wrap the previous markup in an echo.
         2. Escape the double quotes.
         3. Remove the php stuff around $unmatched.
         4. Profit.
    -->
    <?php echo "
    <center><strong>
      Total number of courses parsed: 
      <span onClick=\"show_array( $unmatched )\">
        15
      </span>
    </strong></center>
    "; ?>

  </body>
</html>

Can't pass PHP array to Javascript

3 Answers3