mysql - ユーザーがドロップダウンから選択したアイテムに基づいて行軸をロードする方法

Question

次のテーブルを取得しました:- person{id,last,first,designation_id} すべての指定名を含むドロップダウンが一番上にあります。最初に、ページがロードされると、システムはすべての人を行軸にロードする必要があります。次に、ユーザーが特定の指定を選択すると、行軸が変更され、この指定IDを持つ人が表示されます. 以下の私のコードを見つけてください。誰かが本当に私を助けてくれれば、うまくいきません。

ドロップダウンは問題ありません。すべての指定名のドロップダウン パーツをロードします。

<div class="space">
    Employee: <select id="employee"></select>
  </div>

 loadResources();

  document.querySelector("#employee").addEventListener("change", (ev) => {
    loadEvents();
  });

  async function loadResources() {
    const {data} = await DayPilot.Http.get("backend_designations.php");
    var select = document.querySelector("#employee");
    data.forEach(function(item) {
      var option = document.createElement("option");
      option.value = item.id;
      option.innerText = item.name;
      select.appendChild(option);
    });
    loadEvents();
  }

私が抱えている唯一の問題は、ページが行軸にデータをロードしないときと、1 つのオプションを選択したときです。

index_admin.html の行軸コード

function loadEvents() {
    const employee = document.querySelector("#employee").value;
    const url = `backend_employees_admin.php?resource=${employee}`;
    dp.rows.load(url, () => {
      
    });
  }

backend_employees_admin.php コーディング:

<?php
require_once '_db.php';

  if ($_GET["resource"]) {
    $stmt = $db->prepare('SELECT * FROM person WHERE designation_ID = :resource ORDER BY last, first ');
    $stmt->bindParam(':resource', $_GET['resource']);
 
}
else
{
  $stmt = $db->prepare("SELECT * FROM person ORDER BY last, first ");
}
  $stmt->execute();
  $list = $stmt->fetchAll();




class Employee {}

$result = array();

foreach($list as $employee) {
  $r = new Employee();
  $r->id = $employee['id'];
  $r->name = $employee['last'].', '.$employee['first'];
  //$r->Designation = $employee['Designation'];
  $r->resource=$employee['designation_ID'];
  $result[] = $r;
  }
  
header('Content-Type: application/json');
echo json_encode($result);

誰かが私のためにコードを改善できるかどうかお願いします。