Notes

function login() {
const username = document.getElementById('username').value;
const password = document.getElementById('password').value;

// Send login request to the backend
fetch('http://localhost:5000/authentication/login', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ username, password })
})
.then(response => {
if (response.ok) {
// Hide login form, show class selection
document.getElementById('loginForm').style.display = 'none';
document.getElementById('classSelection').style.display = 'block';
} else {
// Handle invalid login
alert('Invalid login credentials');
}
})
.catch(error => {
console.error('Error:', error);
});
}

function getStudents(classNumber) {
// Fetch students from the backend based on class number
fetch(`http://localhost:5000/student/${classNumber}`)
.then(response => response.json())
.then(data => {
displayStudents(data, classNumber);
})
.catch(error => {
console.error('Error:', error);
});
}

function displayStudents(students, classNumber) {
const studentsList = document.getElementById('studentsList');
studentsList.innerHTML = '';

students.forEach(student => {
const studentDiv = document.createElement('div');
studentDiv.innerHTML = `
<p>ID: ${student.id}</p>
<p>Name: ${student.name}</p>
<p>Assignment: ${student.assignment}</p>
<p>Attendance: ${student.attendance}</p>
<p>Contact: ${student.contact}</p>
<button onclick="updateStudent(${classNumber}, ${student.id})">Update</button>
<button onclick="deleteStudent(${classNumber}, ${student.id})">Delete</button>
<hr>
`;
studentsList.appendChild(studentDiv);
});

// Add a form for adding a new student
const addForm = document.createElement('div');
addForm.innerHTML = `
<h2>Add New Student</h2>
<label for="name">Name:</label>
<input type="text" id="name">
<label for="assignment">Assignment:</label>
<input type="text" id="assignment">
<label for="attendance">Attendance:</label>
<input type="text" id="attendance">
<label for="contact">Contact:</label>
<input type="text" id="contact">
<button onclick="addStudent(${classNumber})">Add Student</button>
`;
studentsList.appendChild(addForm);
}

function updateStudent(classNumber, studentId) {
// Implement logic to update a student (similar to addStudent)
alert(`Update student with ID ${studentId} in class ${classNumber}`);
}

function deleteStudent(classNumber, studentId) {
// Implement logic to delete a student
alert(`Delete student with ID ${studentId} in class ${classNumber}`);
}

function addStudent(classNumber) {
const name = document.getElementById('name').value;
const assignment = document.getElementById('assignment').value;
const attendance = document.getElementById('attendance').value;
const contact = document.getElementById('contact').value;

// Send add student request to the backend
fetch(`http://localhost:5000/student/${classNumber}/add`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ name, assignment, attendance, contact })
})
.then(response => {
if (response.ok) {
// Refresh the students list after adding
getStudents(classNumber);
} else {
// Handle error
alert('Error adding student');
}
})
.catch(error => {
console.error('Error:', error);
});
}