PROBLEM

2
STATEMENT
3
Traditional methods of handling student registrations for college events
4 often involve manual record-keeping, which is time-consuming.
5 Administrators face challenges in managing large volumes of student data,
searching for specific records, anddeleting or updating entries. This leads to
6
inefficiencies in event management, especially as the number of
7
participants grows.
8

10

12.09.202
 METHODOLOGY
1
FRONTEND DEVELOPMENT
2
HTML: Structures the user interface with forms for student
registration and tables for displaying student data. Each
3
page (e.g., detail.html and admin.html) is built using HTML
4 elements to collect and show information.
5
CSS :ensures the design is visually appealing
6

7 JavaScript: objects are used to simulate linked list nodes,

with each node containing student data and a reference to
8
the next node.
9 New nodes are dynamically created and linked during
insertion, and operations like traversal, search, and
10
deletion are performed by manipulating the next
references.
12.09.202
This approach mimics the behavior of a traditional singly
 DATA STRUCTURES

LINKED LIST
1

3
• A linked list is a data structure that stores a
4
sequence of elements.
5

6
• Each element in the list is called a node, and each

7 node has a reference to the next node in the list.

8
• The fi rst node in the list is called the head, and
9

10
the last node in the list is called the tail.

12.09.202
 INSERT - singly linked list
1

2 hea tai
d l
3 r.no nam mar
r.no nam mar r.no nam mar
e k e k e k
4 B C D
5

6
r.no nam mar
e k
- new
7 A node
8
hea tai
9 d l
r.no nam mar r.no nam mar r.no nam mar r.no nam mar
10
e k e k e k e k
A B C D
12.09.202
 DELETE - singly linked list
1

hea tai
2
d l
3 r.no nam mar r.no nam mar r.no nam mar r.no nam mar
e k e k e k e k
4
A B C D
5

6
r.no nam mar
e k
- delete node
7
A
hea tai
8
d l
9 r.no nam mar r.no nam mar r.no nam mar
e k e k e k
10
B C D

12.09.202
 SEARCHING
r.no
SEARCH NODE -
1
nam mar
45
2 e k
B
3

4
Step1 : r.no
nam mar
r.no
nam mar
r.no
nam mar
34 45 67
5
34!=45 e k e k e k
A B C
6

7
Step1 : r.no
nam mar
r.no
nam mar
r.no
nam mar
34 45 67
8
45==45 e k e k e k

9
A B C
10

12.09.202
 CODE
StudentList.prototype.displayStudents = function () {
const studentsTableBody =
document.getElementById('studentsTableBody');
<script> studentsTableBody.innerHTML = '';

function StudentNode(name, sex, rollNo, email, collegeName, let temp = this.head;

phoneNumber) { while (temp !== null) {
1 this.name = name; const row = document.createElement('tr');
this.sex = sex; row.innerHTML = `
2 this.rollNo = rollNo; <td>${temp.name}</td>
this.email = email; <td>${temp.sex}</td>
this.collegeName = collegeName; <td>${temp.rollNo}</td>
3
this.phoneNumber = phoneNumber; <td>${temp.email}</td>
this.next = null; <td>${temp.collegeName}</td>
4 } <td>${temp.phoneNumber}</td>
<td><button class="delete-btn" onclick="deleteStudent($
5 function StudentList() { {temp.rollNo})">Delete</button></td>
this.head = null; `;
} studentsTableBody.appendChild(row);
6
temp = temp.next;
}
StudentList.prototype.insertStudent = function (name, sex, }
7 rollNo, email, collegeName, phoneNumber) {
let newNode = new StudentNode(name, sex, rollNo, email, function searchStudent() {
collegeName, phoneNumber); const rollNo =
8 if (this.head === null) { document.getElementById('searchRollNo').value;
this.head = newNode; const students =
9 } else { JSON.parse(localStorage.getItem('studentList')) || [];
let temp = this.head; const result = students.filter(student => student.rollNo ==
while (temp.next !== null) { rollNo);
10
temp = temp.next; if (result.length > 0) {
} const studentList = new StudentList();
temp.next = newNode; result.forEach(student =>
} studentList.insertStudent(student.name, student.sex,
12.09.202 } student.rollNo, student.email, student.collegeName,
 CODE
}

1
function deleteStudent(rollNo) {
2 let students = JSON.parse(localStorage.getItem('studentList')) || [];
students = students.filter(student => student.rollNo != rollNo);
3 localStorage.setItem('studentList', JSON.stringify(students));
loadStudentData();
}
4

5
function loadStudentData() {
const students = JSON.parse(localStorage.getItem('studentList')) || [];
6 const studentList = new StudentList();
students.forEach(student => studentList.insertStudent(student.name, student.sex, student.rollNo, student.email,
7 student.collegeName, student.phoneNumber));
studentList.displayStudents();
}
8
function goBack() {
9 window.location.href = 'index.html';
}
10

window.onload = loadStudentData;
</script>

12.09.202
 OUTPUT
1

10

12.09.202
 OUTPUT
1

10

12.09.202
THANK YOU