Accessing an array in PHP from Javascript/jQuery

Question

I have all my html, php and javascript/jquery code in a single file. I have an array $arr in php (json_encode($arr)) which when printed shows the data in php. How do I access it in javascript. The array contains all the rows from the resultset of a query execution. I have looked up jsonParse and var json_obj = but have not got any results. I am newbie so any help is appreciated. My code so far in php :

$result_again = $conn->query($sql_again);
if ($result_again->num_rows > 0) 
{
    $resultarray = array();
    while($row_again = $result_again->fetch_assoc()) 
    {
        $resultarray[] = $row_again;
    }
}
echo json_encode($resultarray);

My code in the .js file :

 $( document ).ready(function() {
 $.ajax({
      type: "GET",
      dataType: "json",
      url: "secondform.php",
      success: function(data) {
        alert("Result: " + data);
      }
    });
});

$( document ).ready(function() { alert("inisde"); $.ajax({ type: "GET", dataType: "json", url: "secondform.php", success: function(data) { alert("again"); alert("Result: " + data); } }); alert("outside"); }); — slugspeed
– slugspeed, Commented Apr 17, 2015 at 3:49

Sharn White · Accepted Answer · 2015-04-20 01:18:32Z

2

Step 1:

Render json_encode($arr) into javascript string variable.

var json = '<?= json_encode($arr) ?>';

Step 2:

Parse JSON string into javascript object.

var obj = JSON.parse(json);

Or if you're using jQuery:

var obj = jQuery.parseJSON(json);

You now have a javascript object which you can access properties of like below :)

alert(obj.title); // show object title
alert(obj[0].id); // grab first row of array and show 'id' column

Edit -- in reply to slugspeeds update

Ok, so looks like you're doing this the AJAX way using jQuery. Since your PHP script is using json_encode() the jQuery $.ajax() should return an javascript array object.

$( document ).ready(function() {
    $.ajax({
      type: "GET",
      dataType: "json",
      url: "secondform.php",
      success: function(arr) {
        console.log(arr); // show array in console (to view right-click inspect element somewhere on screen, then click console tab)

        $.each(arr, function( index, row ) { // loop through our array with jQuery
            console.log('array row #'+index, row); // show the array row we are up to
            // you can do what you want with 'row' here
        });

      }
    });
});

For reference: https://developer.chrome.com/devtools/docs/console

edited Apr 20, 2015 at 1:18

answered Apr 17, 2015 at 1:10

Sharn White

6243 silver badges15 bronze badges

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

5 Comments

slugspeed Over a year ago

my php code is like $result_again = $conn->query($sql_again); if ($result_again->num_rows > 0) { $resultarray = array(); while($row_again = $result_again->fetch_assoc()) { $resultarray[] = $row_again; } } echo json_encode($resultarray); and jquery code is like var json = <?= json_encode($resultarray) ?>; var obj=Jquery.parseJSON(json); alert(obj[0].test_question);

slugspeed Over a year ago

the above yields no result

Wesley Smith Over a year ago

@slugspeed add your code in your question, no one is going to bother to read that much un-formatted code in a comment

slugspeed Over a year ago

thansk! just did that!

Sharn White Over a year ago

Good work using AJAX. I've updated my answer above to show you how to access the array after you hit the php script with AJAX.

Collectives™ on Stack Overflow

Accessing an array in PHP from Javascript/jQuery

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related