trouble in handling json response

Question

I have two select box and want to populate 2nd select box based on onchange of first select box. so my code for first select box

      <select id="category-box" name="category" onchange="showCrops()" >
            <option value ="0">Select category</option>
            <?php
                $query = $con->query("Select*from categories");
                while($row = $query->fetch_object())
                {
                    echo "<option value = '".$row->category_id."'>".$row->category."</option>";
                }
            ?>
        </select>

onchange function for ajax call function showCrops() {

    var name = $('#category-box').val();

    $.ajax({
        type: "POST",
        url: "getCropName.php",
        data: {category:name},
        dataType: 'json',
        success: function(data, textStatus, jqXHR)
         {
            var opts = $.parseJSON(data);
            $.each(opts, function(i,d) {
                $('#crop-box').append('<option value="' + d.crop_id + '">' + d.crop_name + '</option>');
            });

        },
        error: function (jqXHR, textStatus, errorThrown)
        {
            console.log(textStatus);
        }
    });

}

php code to get response

header('Content-type: text/html; charset=utf-8');
include("connect.php");

$category = $_POST['category'];

$sql1 = $con->query("SELECT category_id from categories where category ='".$category."' ");
$row1= $sql1->fetch_array();

$sql2 = $con->query("SELECT * from crop_category where category_id ='".$row1['category_id']."' ");


while($row2 = $sql2->fetch_assoc()){
             echo json_encode($row2);
           } 

json response is

          {"crop_id":"1","category_id":"1","crop_name":"rice"}   {"crop_id":"2","category_id":"1","crop_name":"wheat"}

but i'm getting 'parsererror' on main php page. Whats the problem in my code ? i have less knowledge in javascript so maybe need correction to populate by 2nd select box.

Answer 1

Just change the php code, so the right JSON string is generated ..

$arr = array();
while($row2 = $sql2->fetch_assoc()){
    $arr[] = $row2;
}

echo json_encode($arr);