This tutorial will teach you how to make Simple School management System in Jsp.This project will help you those who are interested in learn jsp step by step.
Feature of projects
The system shall be able to record student details
The system shall be able to retrieve the student details
Then system shall be able to Edit and Delete the student details
The system shall be able to record teacher details
The system shall be able to retrieve the teacher details
Then system shall be able to Edit and Delete the teacher details
First Create the index.jsp page and paste the following codes.we have designed simple home page design and link each pages.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> <style> body { background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url("student.jpg"); } </style> </head> <body style="padding:30px" > <div> <a href="addStudent.jsp" class="btn btn-success">Add Student</a> <a href="addTeacher.jsp" class="btn btn-primary">Add Teacher</a> <a href="viewStudent.jsp" class="btn btn-warning">View Student</a> <a href="viewTeacher.jsp" class="btn btn-danger">View Teacher</a> </div> </body> </html>
Student
after that we have created the addStudent.jsp page and paste the following codes.this page which help you to Insert the student records in to the mysql database.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@page import="java.sql.Connection" %> <%@page import="java.sql.DriverManager" %> <%@page import="java.sql.SQLException" %> <%@page import="java.util.logging.Level" %> <%@page import="java.util.logging.Logger" %> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.ResultSet" %> <%@page import="java.util.ArrayList" %> <html> <head> <title>Teachers Registration Form</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> </head> <body> <% Connection con; String msg = ""; String color = ""; if(request.getMethod().compareToIgnoreCase("post")==0) { try { String regno = request.getParameter("regno"); String tname = request.getParameter("tname"); String subject = request.getParameter("subject"); String address = request.getParameter("address"); String phone = request.getParameter("phone"); Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "INSERT INTO teacher(regno,teachername,subject,address,phone) VALUES (?,?,?,?,?)"; PreparedStatement pst = con.prepareStatement(query); pst.setString(1, regno); pst.setString(2, tname); pst.setString(3, subject); pst.setString(4, address); pst.setString(5, phone); pst.executeUpdate(); color = "green"; msg = "Teacher Added Succesfully"; }catch(Exception ex){ ex.printStackTrace(); color = "red"; msg = "Error Occured"; } } %> <div class="form-group col-12 p-0"> <h4 style="color:<%= color %>"><%= msg %></h4> </div> <form id="form" method="post" action="addTeacher.jsp" class="form-horizontal"> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4"> <h2 style="text-align: center">Teacher Details</h2> </div> </div> <hr/> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Registation No</label> <input type="text" name="regno" class="form-control" id="regno"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label >Teacher Name</label> <input type="text" name="tname" class="form-control" id="tname"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Subject</label> <input type="text" name="subject" class="form-control" id="subject"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Address:</label> <input type="text" name="address" class="form-control" id="address"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Phone</label> <input type="text" name="phone" class="form-control" id="phone"> </div> </div> <br/> <div class="form-group" align="right"> <div class="col-sm-6"> <div class="col-sm-2"> <Button class="btn btn-success" style="width: 80px;">Submit</Button> </div> <div class="col-sm-4"> </div> </div> </div> </form> <div class="col-sm-12" align="right"> <a href="index.jsp"><Button class="btn btn-success" style="width: 80px;">Home</Button></a> </div> </body> </html>
after that we have created the viewStudent.jsp page and paste the following codes.this page which help you to view
the students from database and show in to the table.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@page import="java.sql.Connection" %> <%@page import="java.sql.DriverManager" %> <%@page import="java.sql.SQLException" %> <%@page import="java.util.logging.Level" %> <%@page import="java.util.logging.Logger" %> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.ResultSet" %> <%@page import="java.util.ArrayList" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Manage Student</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> </head> <body> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4"> <h2 style="text-align: center">Student Details</h2> </div> </div> <div class="col-sm-2"> <a href="index.jsp"><Button class="btn btn-success" style="width: 80px;">Home</Button></a> </div> <table class="table table-hover"> <thead> <tr> <th scope="col">Reg No</th> <th scope="col">Name</th> <th scope="col">Address</th> <th scope="col">Course</th> <th scope="col">Phone</th> </tr> </thead> <tbody> <% Connection con; PreparedStatement pst; ResultSet rs; Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "Select * from student"; pst = con.prepareStatement(query); rs = pst.executeQuery(); while(rs.next()){ %> <tr> <th scope="row"><%= rs.getString("regno") %></th> <td><%=rs.getString("name")%></td> <td><%=rs.getString("address")%></td> <td><%=rs.getString("course")%></td> <td><%=rs.getString("phone")%></td> <td><a class="btn btn-success" href="editStudent.jsp?id=<%=rs.getString("regno") %>" role="button">Edit</a><a class="btn btn-danger" href="removeStudent.jsp?id=<%=rs.getString("regno") %>" role="button">Remove</a></td> </tr> <% }%> </tbody> </table> </body> </html>
after that we have created the EditStudent.jsp page and paste the following codes.this page which help you to Edit the student records.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@page import="java.sql.Connection" %> <%@page import="java.sql.DriverManager" %> <%@page import="java.sql.SQLException" %> <%@page import="java.util.logging.Level" %> <%@page import="java.util.logging.Logger" %> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.ResultSet" %> <%@page import="java.util.ArrayList" %> <html> <head> <title>Student Registration Form</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> </head> <body> <% Connection con; String msg = ""; String color = ""; if(request.getMethod().compareToIgnoreCase("post")==0) { try { String regno = request.getParameter("regno"); String name = request.getParameter("name"); String course = request.getParameter("course"); String address = request.getParameter("address"); String phone = request.getParameter("phone"); Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "update student set name = ?, address= ?, course =? ,phone= ? where regno = ?"; PreparedStatement pst = con.prepareStatement(query); pst.setString(1, name); pst.setString(2, address); pst.setString(3, course); pst.setString(4, phone); pst.setString(5, regno); pst.executeUpdate(); color = "green"; msg = "Student Updateddddd Succesfully"; }catch(Exception ex){ ex.printStackTrace(); color = "red"; msg = "Error Occured"; } } %> <div class="form-group col-12 p-0"> <h4 style="color:<%= color %>"><%= msg %></h4> </div> <form id="form" method="post" action="editStudent.jsp" class="form-horizontal"> <% PreparedStatement pst; ResultSet rs; Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String id = request.getParameter("id"); pst = con.prepareStatement("select * from student where regno = ?"); pst.setString(1, id); rs = pst.executeQuery(); while(rs.next()) { %> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4"> <h2 style="text-align: center">Student Details</h2> </div> </div> <hr/> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Registation No</label> <input type="text" name="regno" class="form-control" id="regno" value="<%= rs.getString("regno") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label >Student Name</label> <input type="text" name="name" class="form-control" id="name" value="<%= rs.getString("name") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Course:</label> <input type="text" name="course" class="form-control" id="course" value="<%= rs.getString("course") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Address:</label> <input type="text" name="address" class="form-control" id="address" value="<%= rs.getString("address") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Phone</label> <input type="text" name="phone" class="form-control" id="phone" value="<%= rs.getString("phone") %>"> </div> </div> <br/> <div class="form-group" align="right"> <div class="col-sm-6"> <div class="col-sm-2"> <Button class="btn btn-success" style="width: 80px;">Submit</Button> </div> <div class="col-sm-4"> </div> </div> </div> <% } %> </form> <div class="col-sm-12" align="right"> <a href="index.jsp"><Button class="btn btn-success" style="width: 80px;">Home</Button></a> </div> </body> </html>
after that we have created the removeStudent.jsp page and paste the following codes.this page which help you to remove the student records from the database.
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.DriverManager"%> <%@page import="java.sql.Connection"%> <% Connection con; String regno = request.getParameter("id"); Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "delete from student where regno = ?"; PreparedStatement pst = con.prepareStatement(query); pst.setString(1, regno); pst.executeUpdate(); %> <script> window.location.replace("viewStudent.jsp"); </script>
Teacher
after that we have created the addTeacher.jsp page and paste the following codes.this page which help you to Insert the teacher records in to the mysql database.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@page import="java.sql.Connection" %> <%@page import="java.sql.DriverManager" %> <%@page import="java.sql.SQLException" %> <%@page import="java.util.logging.Level" %> <%@page import="java.util.logging.Logger" %> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.ResultSet" %> <%@page import="java.util.ArrayList" %> <html> <head> <title>Teachers Registration Form</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> </head> <body> <% Connection con; String msg = ""; String color = ""; if(request.getMethod().compareToIgnoreCase("post")==0) { try { String regno = request.getParameter("regno"); String tname = request.getParameter("tname"); String subject = request.getParameter("subject"); String address = request.getParameter("address"); String phone = request.getParameter("phone"); Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "INSERT INTO teacher(regno,teachername,subject,address,phone) VALUES (?,?,?,?,?)"; PreparedStatement pst = con.prepareStatement(query); pst.setString(1, regno); pst.setString(2, tname); pst.setString(3, subject); pst.setString(4, address); pst.setString(5, phone); pst.executeUpdate(); color = "green"; msg = "Teacher Added Succesfully"; }catch(Exception ex){ ex.printStackTrace(); color = "red"; msg = "Error Occured"; } } %> <div class="form-group col-12 p-0"> <h4 style="color:<%= color %>"><%= msg %></h4> </div> <form id="form" method="post" action="addTeacher.jsp" class="form-horizontal"> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4"> <h2 style="text-align: center">Teacher Details</h2> </div> </div> <hr/> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Registation No</label> <input type="text" name="regno" class="form-control" id="regno"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label >Teacher Name</label> <input type="text" name="tname" class="form-control" id="tname"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Subject</label> <input type="text" name="subject" class="form-control" id="subject"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Address:</label> <input type="text" name="address" class="form-control" id="address"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Phone</label> <input type="text" name="phone" class="form-control" id="phone"> </div> </div> <br/> <div class="form-group" align="right"> <div class="col-sm-6"> <div class="col-sm-2"> <Button class="btn btn-success" style="width: 80px;">Submit</Button> </div> <div class="col-sm-4"> </div> </div> </div> </form> <div class="col-sm-12" align="right"> <a href="index.jsp"><Button class="btn btn-success" style="width: 80px;">Home</Button></a> </div> </body> </html>
after that we have created the viewTeacher.jsp page and paste the following codes.this page which help you to view
the teachers records from the database and show in to the table.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@page import="java.sql.Connection" %> <%@page import="java.sql.DriverManager" %> <%@page import="java.sql.SQLException" %> <%@page import="java.util.logging.Level" %> <%@page import="java.util.logging.Logger" %> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.ResultSet" %> <%@page import="java.util.ArrayList" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Manage Student</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> </head> <body> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4"> <h2 style="text-align: center">Teacher Details</h2> </div> </div> <div class="col-sm-2"> <a href="index.jsp"><Button class="btn btn-success" style="width: 80px;">Home</Button></a> </div> <table class="table table-hover"> <thead> <tr> <th scope="col">Reg No</th> <th scope="col">Name</th> <th scope="col">Subject</th> <th scope="col">Address</th> <th scope="col">Phone</th> </tr> </thead> <tbody> <% Connection con; PreparedStatement pst; ResultSet rs; Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "Select * from teacher"; pst = con.prepareStatement(query); rs = pst.executeQuery(); while(rs.next()){ %> <tr> <th scope="row"><%= rs.getString("regno") %></th> <td><%=rs.getString("teachername")%></td> <td><%=rs.getString("subject")%></td> <td><%=rs.getString("address")%></td> <td><%=rs.getString("phone")%></td> <td><a class="btn btn-success" href="editTeacher.jsp?id=<%=rs.getString("regno") %>" role="button">Edit</a><a class="btn btn-danger" href="removeTeacher.jsp?id=<%=rs.getString("regno") %>" role="button">Remove</a></td> </tr> <% }%> </tbody> </table> </body> </html>
after that we have created the EditTeacher.jsp page and paste the following codes.this page which help you to Edit the teacher records.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@page import="java.sql.Connection" %> <%@page import="java.sql.DriverManager" %> <%@page import="java.sql.SQLException" %> <%@page import="java.util.logging.Level" %> <%@page import="java.util.logging.Logger" %> <%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.ResultSet" %> <%@page import="java.util.ArrayList" %> <html> <head> <title>Student Registration Form</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> </head> <body> <% Connection con; String msg = ""; String color = ""; if(request.getMethod().compareToIgnoreCase("post")==0) { try { String regno = request.getParameter("regno"); String name = request.getParameter("name"); String course = request.getParameter("course"); String address = request.getParameter("address"); String phone = request.getParameter("phone"); Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "update student set name = ?, address= ?, course =? ,phone= ? where regno = ?"; PreparedStatement pst = con.prepareStatement(query); pst.setString(1, name); pst.setString(2, address); pst.setString(3, course); pst.setString(4, phone); pst.setString(5, regno); pst.executeUpdate(); color = "green"; msg = "Student Updateddddd Succesfully"; }catch(Exception ex){ ex.printStackTrace(); color = "red"; msg = "Error Occured"; } } %> <div class="form-group col-12 p-0"> <h4 style="color:<%= color %>"><%= msg %></h4> </div> <form id="form" method="post" action="editStudent.jsp" class="form-horizontal"> <% PreparedStatement pst; ResultSet rs; Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String id = request.getParameter("id"); pst = con.prepareStatement("select * from student where regno = ?"); pst.setString(1, id); rs = pst.executeQuery(); while(rs.next()) { %> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4"> <h2 style="text-align: center">Student Details</h2> </div> </div> <hr/> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Registation No</label> <input type="text" name="regno" class="form-control" id="regno" value="<%= rs.getString("regno") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label >Student Name</label> <input type="text" name="name" class="form-control" id="name" value="<%= rs.getString("name") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Course:</label> <input type="text" name="course" class="form-control" id="course" value="<%= rs.getString("course") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Address:</label> <input type="text" name="address" class="form-control" id="address" value="<%= rs.getString("address") %>"> </div> </div> <div class="form-group"> <div class="col-sm-4"></div> <div class="col-sm-4 mx-auto"> <label>Phone</label> <input type="text" name="phone" class="form-control" id="phone" value="<%= rs.getString("phone") %>"> </div> </div> <br/> <div class="form-group" align="right"> <div class="col-sm-6"> <div class="col-sm-2"> <Button class="btn btn-success" style="width: 80px;">Submit</Button> </div> <div class="col-sm-4"> </div> </div> </div> <% } %> </form> <div class="col-sm-12" align="right"> <a href="index.jsp"><Button class="btn btn-success" style="width: 80px;">Home</Button></a> </div> </body> </html>
after that we have created the removeTeacher.jsp page and paste the following codes.this page which help you to remove the teacher records from the database.
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.DriverManager"%> <%@page import="java.sql.Connection"%> <% Connection con; String regno = request.getParameter("id"); Class.forName("com.mysql.jdbc.Driver"); con = DriverManager.getConnection("jdbc:mysql://localhost/asiancollege","root",""); String query = "delete from teacher where regno = ?"; PreparedStatement pst = con.prepareStatement(query); pst.setString(1, regno); pst.executeUpdate(); %> <script> window.location.replace("viewTeacher.jsp"); </script>
I have attached the video tutorial below it will help you to do this step by step.