How do I get values from a PHP array to a Javascript Array?

Question

So I am currently doing some coding for the website of someone of my outer family and I had to create a bar chart and now I need to fill it with data from their SQL-Database. First I just echo'd the array like this:

PHP:

<?php
$exampleArray = ["212", "33", "7"]
?>

and JS:

<script> var jExampleArray = <? echo json_encode($exampleArray);?>;  </script>

And then I used jExampleArray in my bar chart code. Now I was very happy but the they say that it needs to be more secure (it involves their company) and I have to find a way to make sure nobody can just see the data while looking through the code on the page. I thought about using Ajax and what not but it just didn't work for me. I got it to alert me the array, but was not able to fill a Javascript array with it.

I never did stuff with JS, PHP oder SQL before and only learned Java in school so I am pretty clueless and most of the stuff I did was with help of the Internet. Luckily I managed to at least understand the code I wrote/copied.

Edit: [] for a JS array not {}

Also, whilst it may not be visible in 'View Source', a simple F12 (Developer Console) in IE/Chrome will allow them to see the resulting JS code, objects, data. — Chris J
– Chris J, Commented Jul 19, 2017 at 7:34
For it to be an array, It should be $exampleArray = ["212", "33", "7"]; — Milan Chheda
– Milan Chheda, Commented Jul 19, 2017 at 7:35
Woops sorry. Tried to type this without looking at my normal code to practise it. — estier
– estier, Commented Jul 19, 2017 at 7:44

Jacob Mulquin · Accepted Answer · 2017-07-19 07:47:43Z

1

Your syntax for creating the PHP array is incorrect.

Use the function json_encode to transform PHP arrays into Javascript arrays and objects.

<?php

$arr = ['hello', 'world', 'foo', 'bar'];
$obj = ['hello' => 'world', 'foo' => 'bar'];

echo 'var Array = ' . json_encode($arr) . PHP_EOL .
     'var Obj = ' . json_encode($obj, JSON_FORCE_OBJECT) . PHP_EOL;

Will result in the following:

var Array = ["hello","world","foo","bar"]
var Obj = {"hello":"world","foo":"bar"}

answered Jul 19, 2017 at 7:47

Jacob Mulquin

3,6081 gold badge22 silver badges24 bronze badges

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

4 Comments

estier Over a year ago

I tried this but it did not work. It always said there is something wrong with the first line $arr = .....

Jacob Mulquin Over a year ago

What version of PHP are you running? Find out by creating a file that is just echo phpversion(). If it is less than 5.4, you need to create arrays using $arr = array('hello', etc');

estier Over a year ago

Thanks! Seems like I am actually using 5.2

estier Over a year ago

I will have to. But I'll only be here for about 8 other days. This said. I tried it with this and it now says "var ArrayTest = ['hello, 'test', 'wow'] (used them for a test). Now is there a way I can let JS output it by using document.write()?

Professor Abronsius · Accepted Answer · 2017-07-19 07:35:44Z

0

Some pseudo code to show how you might accomplish the stated goal

$data=array();
while( $rs=$db->fetch() ){
    $data[]=array(
        'field_1'   =>  $rs->field_1,
        'field_2'   =>  $rs->field_2,
        'field_3'   =>  $rs->field_3
    );
}

$json=json_encode( $data );


<script>
    <?php
        echo "var jExampleArray={$json};";
    ?>
    /* rest of barchart code */
</script>

answered Jul 19, 2017 at 7:35

Professor Abronsius

33.9k5 gold badges36 silver badges49 bronze badges

Comments

ChristianG · Accepted Answer · 2017-07-19 08:25:53Z

0

If the PHP array is available at page load use:

<?php
$phpArray = array('data1' => 2, 'data2' => 3);
?>
<script>var arr = <?php echo json_encode($phpArray); ?>;</script>

To retrieve PHP array in JS after page load using ajax:

var arr = JSON.parse(responseArray);

edited Jul 19, 2017 at 8:25

answered Jul 19, 2017 at 7:37

ChristianG

4584 silver badges11 bronze badges

2 Comments

Luca Kiebel Over a year ago

var arr = JSON.parse(responseArray); wouldn't work

ChristianG Over a year ago

@LucaKiebel JSON.parse is to convert raw text into JS array (if formatted correctly). Updated the thread specifying the method is to be used with ajax response.

Collectives™ on Stack Overflow

How do I get values from a PHP array to a Javascript Array?

3 Answers 3

4 Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related