You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

73 lines
2.4 KiB

window.onload=function(){
addForm=document.getElementById("add");
addForm.style.display="none";
table=document.getElementById("studentInfo");
table.style.display="none"
displayStudents();
}
function addStudent(){
console.log("add student");
form=document.getElementById("add");
form.style.display="block";
}
function addData(){
var name=document.getElementById("addName").value;
var weight=document.getElementById("addWeight").value;
var height=document.getElementById("addHeight").value;
var hairColour=document.getElementById("addHairColour").value;
var gpa=document.getElementById("addGpa").value;
var data={name, weight, height, hairColour, gpa};
var option={method:"POST", body: JSON.stringify(data), headers:{'Content-Type':'application/json'}};
console.log(option);
fetch('/student', option);
}
async function displayStudents(){
var response=await fetch('/student');
var students=await response.json();
for (s of students){
var student=document.createElement('div');
student.className="displayDiv";
student.style.display="inline-block";
student.style.textAlign="center";
student.style.margin="20px";
student.innerText=s.name+"\n"+s.gpa;
student.style.height=parseInt(s.height)+"px";
student.style.width=parseInt(s.weight)+"px";
student.style.overflow="auto";
student.style.padding="20px";
student.style.color=s.hairColour;
student.style.border="1px solid black";
student.addEventListener("mouseenter", function(event){
table.style.display="table";
var info=event.target.innerText;
list=info.split("\n");
document.getElementById("sName").innerHTML=list[0];
document.getElementById("sWeight").innerHTML=event.target.offsetWidth;
document.getElementById("sHeight").innerHTML=event.target.offsetHeight;
document.getElementById("sHairColour").innerHTML=event.target.style.color;
document.getElementById("sGpa").innerHTML=list[1];
})
document.body.appendChild(student);
}
}
function deleteData() {
console.log("in delete")
var name=document.getElementById("findName").value;
var data={name};
var option={
method:'DELETE',
body: JSON.stringify(data),
headers:{
'Content-Type':'application/json'
}
}
console.log(option)
fetch('/student', option);
//window.location.reload();
}