ajax not working displaying data into text area on dropdown change in php

i am trying to display data inside using ajax in php, i have done the following code:

<table>
    <select id="staff" name="staff">
        <option value="@N">N</option>
        <option value="@R">R</option>
        <option value="@S">S</option>
        <option value="@J">J</option>
        <option value="@So">So</option>
        <option value="@Sr">Sr</option>
        <option value="@Jo">Jo</option>
        <option value="@Sc">Sc</option>
        <option value="@P">P</option>
    </select>
    <textarea id="show" rows="8" name="notice" class="form-control"></textarea>
</table>

$('#customer').change(function () {
    var id = $(this).val();
    $.ajax({
        type: "GET",
        url: "page2.php",
        data: "pass_id=" + id,
        success: function (data) {
            alert(data);
            document.getElementById("show").innerHTML = data;
        }
    });
});

below is my page2.php which fetches the data from database:

<?php
    echo $get_id = $_GET['pass_id'];
    include("db.php");
    $sql = "select notice from admin where username='$get_id'";
    while ($row = mysqli_fetch_array($sql)) {
        echo $row['notice'];
    }
?>

but this is not giving me any data in textbox area , can anyone please tell me what is wrong in my code?

Answer

You are using ‘customer’ instead of ‘staff’ please change and try

$('#staff').change(function () {
    var id = $(this).val();
    $.ajax({
        type: "GET",
        url: "page2.php",
        data: "pass_id=" + id,
        success: function (data) {
            console.log(data);
            document.getElementById("show").innerHTML = data;
        }
    });
});



<?php
  $data = [];
  $get_id = $_GET['pass_id'];
  include("db.php");
  $sql = "select notice from admin where username='$get_id'";
  while ($row = mysqli_fetch_array($sql)) {
    $data[] = $row['notice'];
  }
  echo json_encode($data);
?>