Данные Json не отображаются в таблице с использованием php json

я пытаюсь отобразить данные json в таблице, но это не показало, что я пробовал до сих пор, я прикрепил код ниже. что за ошибка при загрузке страницы, я прикрепил изображение ниже. если я проверю в console.info отображаются все данные. не проходит за столом введите описание изображения здесь

Стол

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <table class = "table table-striped" id = "mytable">
    <thead>
      <tr>
        <th>ProductID</th>
        <th>Productname</th>
        <th>Price</th>
        <th>Qty</th>
      </tr>
    </thead>
    <tbody>

    </tbody>
  </table>
</div>
<script>
  function getProducts() {
    $.ajax({
      type: 'GET',
      url: 'cart.php',
      dataType: 'JSON',
      success: function(data) {
        //   console.info(data);
        for (var i = 0; i < data.length; i++) {
          console.info(data);
          var id = data[i].id;
          var product_name = data[i].product_name;
          var price = data[i].price;

          $('#mytable tbody tr').after(
            '<tr> ' +
            '<td>' + product_name + '</td>' +
            '<td>' + price + '</td>' +
            '<td>' + "<input type = 'text' id='pname'/>" + '</td>' +
            '</tr>');
        }
      },
      error: function(xhr, status, error) {
        alert(xhr.responseText);
      }
    });
  }
</script>

корзина.php

<?php
include("db.php");
$conn = new mysqli($servername, $username, $password, $dbname);

// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

$stmt = $conn->prepare("select id,product_name,price from cart order by id DESC ");
$stmt->bind_result($id,$product_name,$price);

if ($stmt->execute()) {
    while ( $stmt->fetch() ) {
        $output[] = array ("id"=>$id, "product_name"=>$product_name,"price"=>$price);
    }

    echo json_encode( $output );
}
$stmt->close();

//}