Testing

data.db

@@ -1,2 +1,2 @@
-{"name":"n0","weight":"80","height":"5","hairColour":"red","gpa":"0","_id":"C7MLNJ6FdWLGty5T"}
+{"name":"n0","weight":"80","height":"5","hairColour":"red","gpa":"2","_id":"C7MLNJ6FdWLGty5T"}
 {"name":"n1","weight":"99","height":"180","hairColour":"pink","gpa":"2","_id":"EZ5eUBQmH2I1bUov"}

public/index.html

@@ -8,7 +8,7 @@
 <div>
     <label>enter student name</label>
     <input type="text" id="findName"/>
-    <button id="editStudent" onclick="editData()">edit</button>
+    <button id="editStudent">edit</button>
     <button id="deleteStudent" onclick="deleteData()">delete</button>
 </div>
 

public/script.js

@@ -5,6 +5,22 @@ window.onload = function () {
     table.style.display = "none"
     edit = document.getElementById("editForm");
     edit.style.display = "none";
+    document.getElementById('editStudent').addEventListener("click", async (event) => {
+        event.preventDefault();
+        var response = await fetch('/student');
+        var students = await response.json();
+        var sName = document.getElementById("findName").value;
+        for (s of students) {
+            if (sName == s.name) {
+                edit.style.display = "inline-block"
+                document.getElementById("editName").innerHTML = s.name;
+                document.getElementById("editWeight").value = s.weight;
+                document.getElementById("editHeight").value = s.height;
+                document.getElementById("editHairColour").value = s.hairColour;
+                document.getElementById("editGpa").value = s.gpa;
+            }
+        }
+    });
     displayStudents();
 }