diff --git a/src/admin/gym/index.php b/src/admin/gym/index.php
index 76b8109b21dbd9d53392eb8ad786271dfe8b4164..f1bad41720c670eedd2ec052e6f921cbc685e964 100644
--- a/src/admin/gym/index.php
+++ b/src/admin/gym/index.php
@@ -121,7 +121,8 @@ AuthMiddleware::getInstance()->secureRoute(true);
     <script src="/public/javascript/gym/trainer.js"></script>
     <script>
         // getGymTrainers(<?php echo $gym_id ?>);
-        getGymApplication(<?php echo $gym_id ?>);
+        // getGymApplication(<?php echo $gym_id ?>);
+        getTrainersByGymId(<?php echo $gym_id ?>);
     </script>
 </body>
 
diff --git a/src/public/javascript/gym/trainer.js b/src/public/javascript/gym/trainer.js
index d54618dca0fec5210acf905edc917f7a70e14443..be6e5810155ff010b866a2c706a4837fd5184a54 100644
--- a/src/public/javascript/gym/trainer.js
+++ b/src/public/javascript/gym/trainer.js
@@ -28,11 +28,30 @@ let trainer_1 = {
 
   let trainerData = [trainer_1, trainer_2];
 
-// Functions
-// function getGymTrainers(gymId) {
-//     showGymTrainers(trainerData);
-// }
+function getTrainersByGymId(gymId) {
+    const xhr = new XMLHttpRequest();
 
+    const apiUrl = `http://localhost:3000/api/trainer?gym_id=${gymId}`;
+
+    xhr.open("GET", apiUrl, true);
+    xhr.setRequestHeader("X-API-KEY", "mbdmatkul4sks");
+
+    xhr.withCredentials = true;
+
+    xhr.onreadystatechange = function () {
+        if (this.readyState === 4) {
+            if (this.status === 200) {
+                const trainersData = JSON.parse(this.responseText);
+                console.log("Trainers data:", trainersData);
+            } else {
+                console.error("Error fetching trainers data");
+            }
+        }
+    };
+
+    xhr.send();
+}
+  
 function showGymTrainers(data) {
     const gymTrainerList = document.getElementById("gym-trainer-list");
     gymTrainerList.innerHTML = "";