Pass array from php back to javascript and loop over it

Question

Hi I'm working on passing back an array from php to javascript. I learned online that I should use json_encode on the array when passing it back but now that i have it in the ajax i'm unsure how i can loop over it because doing things like response[0] gives me [ and response[1] gives me " although when writing the entire thing to the document using innerHTML i can see it looks like an array but using a for loop gives me each letter like i stated above with the response[0] equaling [ rather than the first entry. What am i doing wrong? Any help is greatly appreciated!

PHP

<?PHP
    $link = mysql_connect('localhost', 'root', 'root');
    mysql_select_db("Colleges");
    $result = mysql_query("SELECT * FROM `Colleges` ORDER BY School");
    $schools = array();
    while ($row = mysql_fetch_array($result)) {
        array_push($schools, $row['School']);
    }
    mysql_close();
    die(json_encode($schools));
?>

Ajax

<script type="text/javascript">
    function schools(){
        $.ajax({
            url: "Schools.php",
                type: "POST",
            success: function (response) {
                //Loop over response
            }
        });
    }
</script>

raina77ow · Accepted Answer · 2012-08-23 15:53:42Z

1

You should decode your JSON response (which is a string actually) to be able to work with it as with an object:

var respObj = JSON.parse(response);

The other way around is noticing jQuery that JSON will be supplied by the server (with either dataType: 'json' ajax parameter or Content-Type: application/json response header).

edited Aug 23, 2012 at 15:53

answered Aug 23, 2012 at 15:48

raina77ow

107k16 gold badges205 silver badges240 bronze badges

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

Comments

Matteo Tassinari · Accepted Answer · 2012-08-23 15:52:02Z

0

In the object you pass to the ajax method, you should try to add dataType: 'json' in order to specify that the result is json, or you could specify it in your php script calling header('Content-type: application/json'); before the call to die();

Doing so will result in your response being the object you expect instead of a string.

Finally, you could leave it as is, and call in your success callback response = $.parseJSON(response); which will take the response string and turn it into an object, see http://api.jquery.com/jQuery.parseJSON/

answered Aug 23, 2012 at 15:52

Matteo Tassinari

18.6k8 gold badges65 silver badges85 bronze badges

Comments

Sumit Neema · Accepted Answer · 2012-08-23 15:52:20Z

0

Use Following if it helps

 res=jQuery.parseJSON(response);

for(i=0;i<res.length;i++)
{
  alert(res[i].propertyname);

}

here property name implies to the keys on json .In your case it can be 'School' or just a number i or value can also be just res[i]

answered Aug 23, 2012 at 15:52

Sumit Neema

4803 silver badges18 bronze badges

Comments

adam · Accepted Answer · 2012-08-23 16:41:25Z

0

Javascript

for ( variable in response ) {
    alert(results[variable]);
}

JQuery

$.each(response, function(ind, val){
   alert("index:" + ind + ". value:" + val);
});

edited Aug 23, 2012 at 16:41

answered Aug 23, 2012 at 15:50

adam

2,9708 gold badges57 silver badges90 bronze badges

1 Comment

raina77ow Over a year ago

response supposed to be an array; and it's not recommended to loop through arrays with for-in. With jQuery, rather good $.each method is available; without, old crusty for (var i = 0, l < arr.length; i < l; i++) { ... } idiom is good enough.

Collectives™ on Stack Overflow

Pass array from php back to javascript and loop over it

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related