Access a PHP array from JavaScript

Question

I have the following code where I declare a PHP array variable and inside a function, I put some data into the array. I also display buttons mapped to each index of the array that will show the data in the PHP array for that index number.

When testing on a browser, I don't get the right answer. I checked the page source, it had code like data_array = ["<?php echo implode ('',Array); ?>"]; instead of the text from the Array.

What am I doing wrong and what should I do to get the correct output? (BTW, I tried to execute the same without declaring the function and it seemed to work, but I need a function for my work and can't take that approach).

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
<html lang="en">
    <head>
        <title>Example</title>

        <?php
            $giant_says = array();

            function display()  {
                global $giant_says;

                $giant_says[] = "<a href='http://www.google.com'>Google</a>";
                $giant_says[] = "Yahoo!";
                $giant_says[] = "Bing";

                echo "<div id='content'>";
                echo $giant_says[0];
                echo "</div><br><br>";

                $i = 0;
                while($i < count($giant_says))  {
                    echo "<input type='button' value='".$i."' onClick=\"addtext(".$i.");return false;\"";
                    $i += 1;
                }
            }
        ?>

        <script type="text/javascript">
          function addtext(index) {
              giantSays = ["<?php echo implode ('","', $giant_says); ?>"];
              document.getElementById('content').innerHTML = giantSays[index];
          }
        </script>
    </head>

    <body>
        <?php
            display();
        ?>
    </body>
</html>

(reference) json_encode — Returns the JSON representation of a value — Gordon
– Gordon, Commented Sep 30, 2010 at 20:15

Wraithers · Accepted Answer · 2013-06-16 06:53:34Z

4

You have the order wrong, which is causing the implode() to compress an empty array. I also suggest using json_encode() instead of implode(). It exists for this type of thing - updated example below:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
<html lang="en">
<head>

  <title>Example</title>

  <?php

  $giant_says = array();

  function display(&$giant_says)  {

    // Calculate the array (referenced)

    $giant_says[] = "<a href='http://www.google.com'>Google</a>";
    $giant_says[] = "Yahoo!";
    $giant_says[] = "Bing";

    // Return the HTML, to display later

    ob_start();

    echo "<div id='content'>";
    echo $giant_says[0];
    echo "</div><br><br>";

    $i = 0;
    while($i < count($giant_says))  {
      echo "<input type='button' value='".$i."' onClick=\"addtext(".$i.");return false;\">";
      $i += 1;
    }
    $Return = ob_get_contents();
    ob_end_clean();
    return $Return;
  }

  $Display = display($giant_says);

  ?>

  <script type="text/javascript">
    function addtext(index) {
        giantSays = <?php echo json_encode($giant_says); ?>;
      document.getElementById('content').innerHTML = giantSays[index];
    }
  </script>

</head>

<body>

  <?php
    echo $Display;
  ?>

</body>
</html>

edited Jun 16, 2013 at 6:53

Wraithers

734 bronze badges

answered Sep 30, 2010 at 20:11

Mahdi.Montgomery

2,0244 gold badges17 silver badges21 bronze badges

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

3 Comments

user429113 Over a year ago

the reason I have $giant_says[] filled up inside the function is because I have another function that actually fills the array and not the statements that I had here as an example. So I know your solution will work but what I need is the array to be filled inside the function. Is there any way to get that working? Thanks.

Mahdi.Montgomery Over a year ago

There is (almost) always a way, I've edited my solution to show my take on how to achieve that.

user429113 Over a year ago

I can't express how grateful I am to your reply. Thanks for your advice. That's the perfect solution I was looking for.

webbiedave · Accepted Answer · 2010-09-30 20:01:46Z

2

You're trying to implode the $giant_says array before you've filled it (you're calling display() after the implode when the call needs to happen before).

answered Sep 30, 2010 at 20:01

webbiedave

49k8 gold badges92 silver badges104 bronze badges

Comments

Dubas · Accepted Answer · 2010-09-30 20:11:50Z

1

The problem is that you call the display method, that fills the content after the html part with the javascript is sended.

the html code is "like" making an "echo 'html'" from your php. Your html is already processed but the display method is not called. call the method before the html code.

Example:

<?php 
    $giant_says = array();
    $giant_says[] = "<a href='http://www.google.com'>Google</a>";
    $giant_says[] = "Yahoo!";
    $giant_says[] = "Bing"; 

    function display()  {
        global $giant_says;
        echo '<div id="content">'.$giant_says[0]."</div><br><br>";
        $i = 0;
        while($i < count($giant_says))  {
          echo "<input type='button' value='".$i."' onClick=\"addtext(".$i.");\" />";
          $i += 1;
        }  
    }
?>
<html>
    <head>
        <title>Example</title>
        <script type="text/javascript">
          function addtext(index) {
             giantSays = ["<?php echo implode ('","', $giant_says); ?>"];
             document.getElementById('content').innerHTML = giantSays[index];
             return false;
          }
       </script>
    </head>
    <body>
        <?php  display(); ?>
    </body>
 </html>

edited Sep 30, 2010 at 20:11

answered Sep 30, 2010 at 20:03

Dubas

2,8861 gold badge26 silver badges40 bronze badges

1 Comment

user429113 Over a year ago

the reason I have $giant_says[] filled up inside the function is because I have another function that actually fills the array and not the statements that I had here as an example. So I know your solution will work but what I need is the array to be filled inside the function. Is there any way to get that working? Thanks

Collectives™ on Stack Overflow

Access a PHP array from JavaScript

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related