Send array from php to AJAX response

Question

I am trying to filter state, zones of Nepal using ajax. I have got them in MySQL database.

I have populated zone select box initially, it is okay.

<select class="district col-md-3 center-block" id="zone">
<?php 
    while ($res = mysqli_fetch_assoc($result_zones)) {
        echo "<option value='".$res['name']."'>".$res['name']."</option>";
    }
?>
</select>

Now What I am trying is when user changes zone, I need all districts associated with this zone from districts table.

What I have done is here:

Ajax call

<script>
        $(document.body).on("change","#zone",function(){
            //console.log(this.value);
            $.ajax({
                dataType : 'json',
                async: false,
                url:'process.php?zone_id=' + this.value,
                complete: function (response) {
                    var result = JSON.stringify(response.data);//parsing status from response received from php
                    console.log(result);
                }
               });
        });
</script>

process.php

<?php 
    if (isset($_GET['zone_id'])) {
      $arr =array();
      $zone_id=$_GET['zone_id'];
      $i=0;
      $result = mysqli_query($dbconfig,"SELECT * FROM districts WHERE zone_id = '$zone_id'");
      while ($row = mysqli_fetch_assoc($result)) {
        $arr[$i] = $row;
        $i++;
      }
      // preparing correct format for json_encode
      header('Content-type: application/json'); 
      echo json_encode(array('data' => $arr)); //sending response to ajax
    }
 ?>

When I go through url http://localhost/nepal-locations/process.php?zone_id=8, I'm getting data as I need like below:

{"data":[{"id":"42","name":"Mustang","zone_id":"8"},{"id":"43","name":"Myagdi","zone_id":"8"},{"id":"44","name":"Parbat","zone_id":"8"},{"id":"45","name":"Baglung","zone_id":"8"}]}

But I'm getting data empty in console.

{data: []}
data
:
[]

What might be wrong I'm doing?

Update: output console.log(response)

what's the console.log output if you do var result = response.data; without the json stringify ? — Bdloul
– Bdloul, Commented Jul 18, 2017 at 4:22
echo "<option value='".$res['name']."'>".$res['name']."</option>"; may be you need id instead of name in option value — B. Desai
– B. Desai, Commented Jul 18, 2017 at 4:26
@SureshPokharel have you check url? You need to pass ID while you are passing name in ajax. CHeck my previous comment, It will help you — B. Desai
– B. Desai, Commented Jul 18, 2017 at 4:39

Exprator · Accepted Answer · 2017-07-18 04:27:39Z

3

pass in json encode $arr instead of "data"=>$arr

echo json_encode($arr);

becouse $arr is also an array

edited Jul 18, 2017 at 4:27

Exprator

27.8k6 gold badges54 silver badges64 bronze badges

answered Jul 18, 2017 at 4:26

pradip.parkar

9710 bronze badges

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

Comments

B. Desai · Accepted Answer · 2017-07-18 04:40:38Z

2

You are getting empty array because you are passing name instead of id

change your <select> as below:

<select class="district col-md-3 center-block" id="zone">
<?php 
    while ($res = mysqli_fetch_assoc($result_zones)) {
        echo "<option value='".$res['id']."'>".$res['name']."</option>"; //<-----Add id instead of name
    }
?>
</select>

answered Jul 18, 2017 at 4:40

B. Desai

16.4k5 gold badges28 silver badges48 bronze badges

Collectives™ on Stack Overflow

Send array from php to AJAX response

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related