Getting an array from PHP in JavaScript/jQuery using JSON, and manipulating it afterwards?

Question

So I'm in the midst of a rather sticky problem. I'm coming close - so close! - to solving it but not quite there. I've seen lots of examples but none that do just exactly what I want.

On a php page myreqpdo.php, I recover some data lines from a MySQL table and store them in a two-dimensional array. On my page index.php, I need to access this array via JavaScript and play with it a bit before sending it to what I need to fill.

Here is myreqpdo.php:

$locWanted = $_POST['searchTerm'];
echo json_encode(getVillesCPs($locWanted));

function getVillesCPs ($searchTerm) {
    // code to access DB here
    return $resultats;
}

I found this example using jQuery, but it's for an instance in which one would just like to insert the list directly into the code without any further manipulation:

<html>
<head>
        <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
</head>
<body>

        <!-- this UL will be populated with the data from the php array -->
        <ul></ul>

        <script type='text/javascript'>
        $(document).ready(function(){
                /* call the php that has the php array which is json_encoded */
                $.getJSON('json_encoded_array.php', function(data) {
                        /* data will hold the php array as a javascript object */
                        $.each(data, function(key, val) {
                                $('ul').append('<li id="' + key + '">' + val.first_name + ' ' + val.last_name + ' ' + val.email + ' ' + val.age + '</li>');
                        });
                });

        });
        </script>

</body>
</html>

That won't work for me, because this function is one that is triggered based on search parameters. I need something like the following pseudocode:

<script>
    var myArray = {code to recover PHP array};
    // manipulations for myArray here, using data to fill values of items on page
</script>

I keep thinking the answer is right under my nose, but I am really not seeing an example like what I want! Any ideas?

You have the data that you want to manipulate in the callback function of your ajax call, var myArray = data; although you don't really need a new variable of course... — jeroen
– jeroen, Commented Jan 3, 2015 at 14:08
Also note that you are not sending any data: $.getJSON('json_encoded_array.php', {searchTerm: ???}, function(data) { — jeroen
– jeroen, Commented Jan 3, 2015 at 14:15
Are you looking to build an array on the javascript from the php json string data? If you are looking to do that, use jQuery.parseJSON function — Prashant
– Prashant, Commented Jan 3, 2015 at 16:11

Veve · Accepted Answer · 2015-01-03 17:49:37Z

1

You don't need jQuery to insert an array from PHP in your javascript code, just insert it directly where needed:

<script>
    var myArray = <?php echo json_encode(getVillesCPs($locWanted)); ?>;
    // manipulations for myArray here, using data to fill values of items on page
</script>

Note that you must set a value to the $locWanted var in your PHP code before this code, otherwhise getVillesCPs will be called with an empty parameter.

EDIT: since your getVillesCPs is defined in another PHP file, include it in your main page before calling it (assuming your main page is a PHP file):

<?php 
//including the PHP file containing the function
include 'myreqpdo.php';
//setting a value for $locWanted, used then in the rest of the page
$locWanted = 'Paris';
?>
<script>
    var myArray = <?php echo json_encode(getVillesCPs($locWanted)); ?>;
    // manipulations for myArray here, using data to fill values of items on page
</script>

And remove the 2 first lines of code in myreqpdo.php, you don't want to echo anything before the function is called.

edited Jan 3, 2015 at 17:49

answered Jan 3, 2015 at 16:01

Veve

6,7785 gold badges44 silver badges62 bronze badges

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

1 Comment

rpmth Over a year ago

That looks like what I want, except that the getVillesCPs method is in a separate *.php file. How do/can I invoke it remotely?

Collectives™ on Stack Overflow

Getting an array from PHP in JavaScript/jQuery using JSON, and manipulating it afterwards?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related