Practical File

For
AISSCE 2019-20 Examination
As a part of the Informatics Practices Course (065)

SUBMITTED BY:
Iqra Aslam

Under the Guidance of:

Ms. Ayushi Aggarwal (PGT Comp Sc.)
SALWAN GIRLS SR. SEC. SCHOOL
(Old Rajender Nagar, Delhi -110060)

Page 1
 DECLARATION
Thi s is to c erti fy that IQRA ASLAM, of 12 t h B on t h e
res ea rch on t he ONLINE E XAMINATION SYSTEM
under t he gu id ance of Mi ss. Ayushi H.S Aggar wa l
duri ngt h e year 2 01 9 -20 .

Page 2
 CERTIFICATE
Thi s is to c erti fy that IQRA ASLAM, of 12 t h B on t h e
res ea rch on t he ONLINE E XAMINATION SYSTEM
under t he gu id ance of Mi ss. Ayushi H.S Aggar wa l
duri ngt h e year 2 01 9 -20 .

Page 3
 ACKNOWLEDGEMENT

We would like to express our special thanks of gratitude to our teacher who gave me the golden
opportunity to do this wonderful project on the topic Online Examination System on python, which
also helped us in doing a lot of research and we came to know about so many new things.We are
really thankful to them.

We would like to thank God, for Her unending grace and love throughout our academic life. Without
it, I would not have made it this far. We would also like to thank our families for their help and
understanding throughout or academic life.

Again we would also like to thank our friends who helped us a lot in finalizing this project within the
limited time frame.

This project really helped us to learn skills of python and its functionality. I gained a lot of
knowledge while completing this project.

At last we are thankful to each and every person who helped us in completing this project.

Page 4
 AIM OF THE PROJECT

To to make a System which is a user friendly, easy to use website where admin can
add courses and objective questions in each course. Where Student can attempt for
quiz and check course knowledge. Where A timer runs for given time and within that
period one has to answer for all those questions, some buttons are presented at the
bottom of the window like start button, previous , next , finish.

Page 5
 Page No.

Chapter 1. Introduction

1) Introduction to the System 8

2) Objective 9

Chapter 2. Hardware and Software requirement

1) Software requirement 10
2) Hardware requirements 11

Chapter 3. Modules

1) Admin Module 12
2) User Module 12

Chapter 4.Implementation issues

1) HTML 13
2) Cascading style sheet(CSS) 14
3) Python 15
4) Django 16
5) Sqlite 17

Chapter 5. System Design

1) Introduction 21
2) Conceptual Design 22
3) ER-Diagram 23

Page 6
 4) Logical Design 23
5) Physical Design 24
6) Data Flow Diagram “Online Examination System” 24

Chapter 6.User Screens 25-41

Chapter 7.Coding 42-65

Chapter 8. Conclusion
1) Benefits Accrued from “Online Examination System” 66
2) Limitations of “Online Examination System” 67

Chapter 9. Future Scope

1) Future Scope 68

Bibliography

Page 7
 CHAPTER # 1
Introduction
Contents:

� Introduction
� Objective

Page 8
 Introduction to the System:

Online Examination System is a user friendly, easy to use website where admin can
add courses and objective questions in each course. Student attempt for quiz for check
our course knowledge. A timer runs for given time and within that period one has to
answer for all those questions, some buttons are presented at the bottom of the
window like start button, previous , next , finish.

Objective:
� It provides a less expensive as well as an effective method of performing
examinations.
� It provides best facilities for the students to answer the question only with a single
click.
� It saves time as well as money.
� It lessens the student’s and teacher’s frustration

Page 9
 #

Contents:

� Software requirement
� Hardware requirements

Page 10
 Software Requirements:

� Technology: Python Django

� IDE : Pycharm/Atom
� Client Side Technologies: HTML, CSS, JavaScript , Bootstrap
� Server Side Technologies: Python
� Data Base Server: Sqlite
� Operating System: Microsoft Windows/Linux

Hardware Requirements:

� Processor - 2.0 GHz or above.

� 2 GB RAM or more.

� 160 GB or more Hard Disk Drive.

Page 11
 CHAPTER # 3
Modules

Admin Modules :
ADD COURSES : Admin can add new courses and its quiz time and
marks.

ADD Questions : Admin can add questions and its four option and one
correct answer.

Manage Students

Student Modules :
GIVE EXAM
VIEW RESULT
EDIT PROFILE
Ask Queries

Page 12
 CHAPTER # 4
Implementation issues

HTML

HTML (Hypertext Markup Language) is the set of markup symbols or codes inserted in a file
intended for display on a World Wide Web browser page. The markup tells the Web browser
how to display a Web page's words and images for the user. Each individual markup code is
referred to as an element (but many people also refer to it as a tag). Some elements come in
pairs that indicate when some display effect is to begin and when it is to end.

Page 13
CASCADING STYLE SHEET (CSS)

Cascading Style Sheets (CSS) are a collection of rules we use to define and modify web
pages. CSS are similar to styles in Word. CSS allow Web designers to have much more
control over their pages look and layout. For instance, you could create a style that defines
the body text to be Verdana, 10 point. Later on, you may easily change the body text to Times
New Roman, 12 point by just changing the rule in the CSS. Instead of having to change the
font on each page of your website, all you need to do is redefine the style on the style sheet,
and it will instantly change on all of the pages that the style sheet has been applied to. With
HTML styles, the font change would be applied to each instance of that font and have to be
changed in each spot.

CSS can control the placement of text and objects on your pages as well as the look of those
objects.

HTML information creates the objects (or gives objects meaning), but styles describe how the
objects should appear. The HTML gives your page structure, while the CSS creates the
“presentation”. An external CSS is really just a text file with a .css extension. These files can
be created with Dreamweaver, a CSS editor, or even Notepad.

The best practice is to design your web page on paper first so you know where you will want
to use styles on your page. Then you can create the styles and apply them to your page.

Page 14
LANGUAGE Used :- Python

Python is a widely used general-purpose, high level programming language. It was initially
designed by Guido van Rossum in 1991 and developed by Python Software Foundation. It
was mainly developed for emphasis on code readability, and its syntax allows programmers
to express concepts in fewer lines of code.
Python is a programming language that lets you work quickly and integrate systems more
efficiently.
Python is dynamically typed and garbage-collected. It supports multiple programming
paradigms, including procedural, object-oriented, and functional programming. Python is
often described as a "batteries included" language due to its comprehensive standard library.

Page 15
Django

Django is a web application framework written in Python programming language. It is based

on MVT (Model View Template) design pattern. The Django is very demanding due to its
rapid development feature. It takes less time to build application after collecting client
requirement.

This framework uses a famous tag line:The web framework for perfectionists with
deadlines.

Page 16
SQLite

SQLite3 can be integrated with Python using sqlite3 module, which was written by Gerhard
Haring. It provides an SQL interface compliant with the DB-API 2.0 specification described
by PEP 249. You do not need to install this module separately because it is shipped by
default along with Python version 2.5.x onwards.

To use sqlite3 module, you must first create a connection object that represents the database
and then optionally you can create a cursor object, which will help you in executing all the
SQL statements.

Page 17
 CHAPTER # 5
System Design

Contents:
� Use case diagram
� Sequence Diagram
� Data flow diagram

Page 18
 Use Case Diagram:

� Use case diagram consists of use cases and actors and shows the interaction
between them. The key points are:

� The main purpose is to show the interaction between the use cases and the
actor.

� To represent the system requirement from user’s perspective.

� The use cases are the functions that are to be performed in the module.

Manage Courses

Manage
Questions

�
Manage
ADMIN Students
SYSTEM

Manage
Feedback

Page 19
 Use Case Diagram between ADMIN and SYSTEM:

Fig.5.1

Edit Profile

Give Exam

View Marks

USER Fig.5.2
Send Query SYSTEM

Use Case Diagram between USER and SYSTEM:

Page 20
Sequence Diagram For Administrator:-

Login Application Database

Login
:Request

:Validate()
:executeQuery()

Administrator Response
Show Result

Success:hide() Failed:show()

Fig.5.4

Page 21
Data Flow Diagram

Page 22
FlowChart :

Page 23
Entity Relationship Diagrams (ER-Diagrams):

Page 24
 CHAPTER # 6
User Screens and Report
Output screens

HOME PAGE

Page 25
 ADMIN LOGIN PAGE

Page 26
 ADMIN HOME PAGE

Page 27
 ADD COURSE PAGE

Page 28
 ADD COURSE PAGE

Page 29
 ADD TOPIC PAGE

Page 30
 VIEW TOPICS

Page 31
 ADD QUESTION PAGE

Page 32
 VIEW QUESTIONS

Page 33
 ADD STUDENT PAGE

Page 34
 VIEW STUDENT REPORT PAGE

Page 35
 VIEW STUDENT REPORT PAGE

Page 36
 STUDENT HOME PAGE

Page 37
 VIEW COURSE LIST

Page 38
 VIEW TOPIC LIST

Page 39
 Page 40
 Page 41
 CHAPTER # 7
Coding

HOME PAGE CODING

{% extends 'base.html' %}
{% load static %}
{% block body %}

<div>
<div id="demo" class="carousel slide" data-ride="carousel">

<!-- Indicators -->

<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1"></li>
<li data-target="#demo" data-slide-to="2"></li>
</ul>

<!-- The slideshow -->

<div class="carousel-inner" style="width:1550px;height:350px">
<div class="carousel-item active">
<img src="{% static 'images/quiz.jpg' %}" alt="Los
Angeles"style="height:350px">
</div>
<div class="carousel-item">

Page 42
 <img src="{% static 'images/Quiz1.jpg' %}" alt="Chicago"style="height:350px">
</div>
<div class="carousel-item">
<img src="{% static 'images/QUIz3.jpg' %}" alt="New
York"style="height:350px">
</div>
</div>

<!-- Left and right controls -->

<a class="carousel-control-prev" href="#demo" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#demo" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
</div>
<br><br>
<center>
<h1>Online Quiz System</h1>
</center>
<table width="1000" align="center">
<tr>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
</tr>
<tr>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Page 43
Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
</tr>
</table><hr>
<div style="background-color:GhostWhite;padding:20px">
<table width="1000" align="center">
<tr>
<td><img src="{% static 'images/QUIz3.jpg' %}"
style="width:300px;height:200px"></td>
<td><center><H3>ABOUT ONLINE QUIZ SYSTEM</H3><hr>A quiz is a form of
game or mind sport, in which the players (as individuals or in teams) attempt to answer
questions correctly. It is a game to test your knowledge about a certain subject. ... They
may also involve eliminating those who get too many questions wrong, the winner being
the last man standing.</center></td>

</table><br><br>
</div>

{% endblock %}

Page 44
 ADMIN LOGIN PAGE CODING

{% extends 'base.html' %}
{% load static %}
{% block body %}
{% if error %}
<script>alert('Username or Password is not Matching...')</script>
{% endif %}
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:15px;
text-align:center;
color:white;}

input[type=text], select, textarea {

width: 1130px;
padding: 20px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}
input[type=password], select, textarea {
width: 1130px;
padding: 20px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

label {
Page 45
 padding: 10px 12px 10px 0;
display: inline-block;
}

input[type=submit] {
background-color:DarkSlateGray ;
color: white;
padding: 12px 538px;
border: none;
border-radius: 4px;
cursor: pointer;
margin-top: 80px;
}

input[type=submit]:hover {
background-color: blue;
}

.container {
margin-top:20px;
margin-bottom:20px;
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}

.col-25 {
float: center;
width: 25%;
margin-top: 6px;

.col-75{
Page 46
 float: center;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 600px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
</head>
<body>
<div style="background-color:Darkslategrey;color:white;padding:20px">
<table width="1000" align="center">
<tr><th>TUTOR LOGIN</th>
</tr>
</table>
</div>

<div class="container ">

<center>
<p style="width:1100px" align="center">LOGIN TO YOUR
ACCOUNT</p></center>

Page 47
 <form action="" method="post">
{% csrf_token %}
<div class="row">
<div class="col-25">
<label for="fname"></label>
</div>
<div class="col-100">
<input type="text" id="userid" name="username" placeholder="User Id"><br>
</div>
</div>
<div class="row">
<div class="col-25">
<label for="lname"></label>
</div>
<div class="col-100">
<input type="password" id="password" name="password"
placeholder="Password">
</div>
</div>

<div class="row">
<input type="submit" value="Submit">
</div>
<!-- <h5><a href="{% url 'signuptutor' %}" style="margin-left:380px">>>>> For
New Register Click Here..</a> </h5>-->

</form>
</div>
{% endblock %}

Page 48
 ADMIN HOME PAGE

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">TUTOR DASHBOARD</th>
</tr>
</table>
</div>

<style>
.button {
background-color: DarkSlateGray;
border: 1px solid black;
color: white;
padding: 40px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
margin: 20px 10px;
cursor: pointer;
width:110px;
}

.button1 {border-radius: 50%;}

Page 49
</style>

<div style="padding:70px">
<table width="800" align="center">
<tr><center>
<th style="border:1px solid black;padding:2px"><a href="{% url
'addtopic' %}"><button class="button button1">Add<br>Topics</button></a></th>
<th style="border:1px solid black"><a href="{% url 'addcourse'
%}"><button class="button button1">Add<br>Course</button></a></th>
<th style="border:1px solid black"><a href="{% url 'addquestion'
%}"><button class="button button1">Add<br>Questions</button></a></th>
<th style="border:1px solid black"><a href="{% url 'adduser'
%}"><button class="button button1">Add<br>Users</button></a></th>
<th style="border:1px solid black"><a href="{% url 'tutorreport'
%}"><button class="button button1">Tutors<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'studentreport'
%}"><button class="button button1">Students<br>Report</button></a></th>
</center>
</tr>
<tr>
<th style="border:1px solid black"><a href="{% url 'questionreport'
%}"><button class="button button1">Questions<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'resultreport'
%}"><button class="button button1">Results<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'topicreport'
%}"><button class="button button1">Topics<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myaccount'
request.user.id %}"><button class="button
button1">My<br>Account</button></a></th>
<th style="border:1px solid black"><a href="{% url 'changepassword'
request.user.id %}"><button class="button button1">Change
<br>Password</button></a></th>
Page 50
 <th style="border:1px solid black"><a href="{% url 'logout'
%}"><button class="button button1"
style="height:115px">Logout</button></a></th>
</tr>
</table>
</div>

{% endblock %}

Page 51
 ADD QUESTION PAGE CODING

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">ADD QUESTION</th>
</tr>
</table>
</div>
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:13px;
color:white;
text-align:center}

input[type=text], select, textarea {

width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

label {
padding: 10px 12px 10px 0;
Page 52
 display: inline-block;
}

input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 430px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

input[type=submit]:hover {
background-color: grey;
}

.container {
margin-top:20px;
margin-bottom:20px;
width:900px;
float:center;
border-radius: 5px;
background-color: #f2f2f2;
padding: 28px;

.col-25{
float: left;
Page 53
 width: 25%;
margin-top: 6px;
}

.col-75{
float: left;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 800px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
<div class="container">
<p>Add New Question</p>
<table width="850">

<form action="" method="post">

{% csrf_token %}
<tr>
<th><label for="select topic">Select Course</label>
<select id="topic" name="select_topic">
{% for i in topic %}
Page 54
 <option value="{{i.topic}}">{{i.topic}}[{{i.course.course_name}}]</option>
{% endfor %}
</select></th>
</tr>
<tr>
<th><label for="fullquestion">Full Question</label>
<input type="text" id="fullQuetion" name="fullQuestion" placeholder="Full
Question.."></th>
</tr>
<tr>
<th><label for="option1">Option1</label>
<input type="text" id="option1" name="option1" placeholder="Option1"></th>
<th><label for="option2">Option2</label>
<input type="text" id="option2" name="option2" placeholder="Option2"></th>
</tr>
<tr>
<th><label for="option3">Option3</label>
<input type="text" id="option3" name="option3" placeholder="Option3"></th>
<th><label for="option4">Option4</label>
<input type="text" id="option4" name="option4" placeholder="Option4"></th>
</tr>
<tr>
<th><label for="answer">Answer</label>
<input type="text" id="answer" name="answer" placeholder="Answer"></th>
</tr>

</table>

<input type="submit" value="Submit">

</form>

</div>
{% endblock %}

Page 55
 ADD COURSE CODING

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">ADD COURSE</th>
</tr>
</table>
</div>
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:13px;
color:white;
text-align:center}

input[type=text], select, textarea {

width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

textarea {
width:100%;
height: 150px;
padding: 12px 20px;
Page 56
 box-sizing: border-box;
border: 2px solid #ccc;
border-radius: 4px;
background-color: #f8f8f8;
font-size: 16px;
resize: none;
}

label {
padding: 10px 12px 10px 0;
display: inline-block;
}

input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 430px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

input[type=submit]:hover {
background-color: grey;
}

.container {
margin-top:20px;
margin-bottom:20px;
float:center;
border-radius: 5px;
Page 57
 background-color: #f2f2f2;
padding: 28px;

.col-25{
float: left;
width: 25%;
margin-top: 6px;
}

.col-75{
float: left;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 800px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
<div class="container" style="width:900px">
Page 58
 <p>Add New Course</p>

<form action="" method="post">

{% csrf_token %}

<div class="row">
<div class="col-25">
<label for="regular news"> Course Name</label>
</div>
<div class="col-100">
<input type="text" id="regularnews" name="course" placeholder="Course
Name">
</div>
</div>
<div class="row">
<div class="col-25">
<label for="regular news"> Preparation of the Course </label>
</div>
<textarea name="desc" placeholder="write something about course....."></textarea>
</div>

<div class="row">
<input type="submit" value="Submit">
</div>
</form>
</div>
{% endblock %}

Page 59
 START QUIZ PAGE CODING
{% extends 'base3.html' %}
{% load static %}
{% block body %}
<style>
input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 30px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

</style>
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">TOPIC DETAILS</th>
</tr>
</table>
</div>

<div class="container" style="padding:20px;border:0px solid white">

<form action="" method="post">

{% csrf_token %}
<table class="table" style="border:0px solid white">
<thead style="background-color:DarkSlateGrey;color:white;border-color:white">
<tr><th>Sr. No.</th>
<th>Question</th>
Page 60
 </tr>
</thead>
{% for i in topic %}
<tbody><tr>
<td>{{forloop.counter}}</td>
<td>{{i.question}}</td>
</tr>
</tbody>
<tbody>
<tr><td></td>
<td><input type="radio" name="que{{forloop.counter}}"
value="{{i.option1}}">{{i.option1}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option2}}">{{i.option2}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option3}}">{{i.option3}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option4}}">{{i.option4}}
</td></tr>
</tbody>
{% endfor %}
<tbody><tr>

<td></td>
<td style="float:right"><input type="submit" value="Submit
Quiz"></td></tr></tbody>

</table>
</form>
</div>

{% endblock %}

Page 61
 STUDENT HOME PAGE

{% extends 'base3.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">Student Dashboard</th>
</tr>
</table>
</div>

<style>
.button {
background-color: DarkSlateGray;
border: 1px solid black;
color: white;
padding: 40px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
margin: 20px 10px;
cursor: pointer;
width:110px;
}

.button1 {border-radius: 50%;}

Page 62
</style>

<div style="padding:70px">
<table width="800" align="center">
<tr><center>
<th style="border:1px solid black;padding:2px"><a href="{% url
'courselist' %}"><button class="button button1">Course<br>List</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myaccountstudent'
request.user.id %}"><button class="button
button1">My<br>Account</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myresult'
request.user.id %}"><button class="button
button1">My<br>Result</button></a></th>
<th style="border:1px solid black"><a href="{% url 'changepassword2'
request.user.id %}"><button class="button
button1">Change<br>Password</button></a></th>
<th style="border:1px solid black"><a href="{% url 'logout'
%}"><button class="button button1"
style="height:115px">Logout</button></a></th>
</center>
</tr>
</table>
</div>

{% endblock %}

Page 63
 VIEW RESULT

{% extends 'base3.html' %}
{% load static %}
{% block body %}
<style>
.button {
background-color: LawnGreen;
border: 1px solid black;
color: white;
padding:10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
cursor: pointer;
width:110px;
}

.button1{
border-radius:8%;
border-color:grey
}
</style>
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr>
<th style="color:white">TOPIC DETAILS</th>
</tr>
</table>
</div>
<div class="container" style="padding:20px;border:0px solid white">
<table class="table table-bordered" id="myTable" style="border:0px solid white">
<thead style="background-color:DarkSlateGrey;color:white;border-color:white">
Page 64
 <tr>
<th>Se_No.</th>
<th>Username</th>
<th>Topic Name</th>
<th>Result</th>
<th>Date</th>
<th>Marks</th>
<th>Action</th>
</tr>
</thead>
<tbody style="border-color:white">
{% for i in data %}
<tr>
<td>{{forloop.counter}}</td>
<td>{{i.bhu.user.username}}</td>
<td>{{i.topic.topic}}[{{i.topic.course.course_name}}]</td>
<td>{{i.result}}</td>
<td>{{i.date1}}</td>
<td>{{i.marks}}</td>
<td><a href="{% url 'viewresult' i.id %}"><button class="button button1">View
Result</button></a>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock %}

Page 65
 CHAPTER # 8
Advantages & Limitations

Advantages of “Online Examination System”:

An online examination system has plenty of advantages:

1. It saves paper.
You never have to print an exam for your students and hand them out. Saves paper.
Saves trees. Everybody happy.
2. It saves time.
You can setup an exam in such a way that it will auto-grade itself. If you only use
multiple choice questions you never have to check an exam again. The online exam
system will take care of that hassle. Completly automated.
3. It saves more time.
The distribution of the exam doens't take you any time. Just upload the email
addressess of your students and send them an invite. And after the exam they get their
result instantly.
4. It saves you money.
You don't need to buy any paper. Sending an email is free. On top of that you save on
the logistics: your students don't have to assemble in classroom to take the exam.
They can do it within a given time frame from their own device. You don't have to
rent a classroom. You don't have to hire someone to check the students taking the
exam.
5. It saves the student money.
Students don't have to travel to a specific location to conduct the exam. So even for
students from remote area's it's possible to take the exam.
6. It's more secure.
You can make a big question bank with a lot of questions. Every student gets a
random selection from that question bank. So it's of little use to share the questions
among the exam takers to give them a head start. Try that on paper ;)

Page 66
 Limitations of “Online Examination System”:
Besides the above achievements and the successful completion of the project, we still
feel the project has some limitations, listed as below:

1. It is not a large scale system.

2. Only limited information provided by this system.
3. Since it is an online project, customers need internet connection to use it.
4. People who are not familiar with computers can’t use this software.

Page 67
 CHAPTER # 8
Future Scope

FUTURE SCOPE

This web application involves almost all the features of the online examination. The future
implementation will be online help for the users and chatting with website administrator.

CONCLUSION

The project entitled “Online Examination System” is developed using HTML and CSS as
front end and Python and Sqlite database in back end to computerize the process. This project
covers only the basic features required.

Page 68
 Bibliography

REFERENCES

� WEB REFERENCE

� Wikipedia

� https://www.geeksforgeeks.org/python-django/

� https://www.javatpoint.com

� https://www.python.org/

� https://www.tutorialspoint/

� REFERENCE BOOKS

Two scoops of Django for 1.11 by Daniel Greenfeld’s and Audrey

Greenfield

Lightweight Django by Elman and Mark Lavin

Page 69
This document was created with the Win2PDF “print to PDF” printer available at
http://www.win2pdf.com
This version of Win2PDF 10 is for evaluation and non-commercial use only.
This page will not be added after purchasing Win2PDF.
http://www.win2pdf.com/purchase/
 Practical File
For
AISSCE 2019-20 Examination
As a part of the Informatics Practices Course (065)

SUBMITTED BY:
Iqra Aslam

Under the Guidance of:

Ms. Ayushi Aggarwal (PGT Comp Sc.)
SALWAN GIRLS SR. SEC. SCHOOL
(Old Rajender Nagar, Delhi -110060)

Page 1
 DECLARATION
This is to certify t h at IQ RA ASLAM, of 12 t h B on the
research on t he ONLI NE EXAMINATI ON SYSTEM
under t he guidance of M iss. Ayushi H.S Aggarwal
durin gt he year 2019-20.

Page 2
 CERTIFICATE
This is to certify t h at IQ RA ASLAM, of 12 t h B on the
research on t he ONLI NE EXAMINATI ON SYSTEM
under t he guidance of M iss. Ayushi H.S Aggarwal
durin gt he year 2019-20.

Page 3
 ACKNOWLEDGEMENT

We would like to express our special thanks of gratitude to our teacher who gave me the golden
opportunity to do this wonderful project on the topic Online Examination System on python, which
also helped us in doing a lot of research and we came to know about so many new things.We are
really thankful to them.
We would like to thank God, for Her unending grace and love throughout our academic life. Without
it, I would not have made it this far. We would also like to thank our families for their help and
understanding throughout or academic life.
Again we would also like to thank our friends who helped us a lot in finalizing this project within the
limited time frame.
This project really helped us to learn skills of python and its functionality. I gained a lot of
knowledge while completing this project.
At last we are thankful to each and every person who helped us in completing this project.

Page 4
 AIM OF THE PROJECT

We would like to express our special thanks of gratitude to our teacher who gave me the golden
opportunity to do this wonderful project on the topic Online Examination System on python, which
also helped us in doing a lot of research and we came to know about so many new things.We are
really thankful to them.
We would like to thank God, for Her unending grace and love throughout our academic life. Without
it, I would not have made it this far. We would also like to thank our families for their help and
understanding throughout or academic life.
Again we would also like to thank our friends who helped us a lot in finalizing this project within the
limited time frame.
This project really helped us to learn skills of python and its functionality. I gained a lot of
knowledge while completing this project.
At last we are thankful to each and every person who helped us in completing this project.

Page 5
 Page No.

Chapter 1. Introduction

1) Introduction to the System 8

2) Objective 9

Chapter 2. Hardware and Software requirement

1) Software requirement 10
2) Hardware requirements 11

Chapter 3. Modules

1) Admin Module 12
2) User Module 12

Chapter 4.Implementation issues

1) HTML 13
2) Cascading style sheet(CSS) 14
3) Python 15
4) Django 16
5) Sqlite 17

Chapter 5. System Design

1) Introduction 21
2) Conceptual Design 22
3) ER-Diagram 23

Page 6
 4) Logical Design 23
5) Physical Design 24
6) Data Flow Diagram “Online Examination System” 24

Chapter 6.User Screens 25-41

Chapter 7.Coding 42-65

Chapter 8. Conclusion
1) Benefits Accrued from “Online Examination System” 66
2) Limitations of “Online Examination System” 67

Chapter 9. Future Scope

1) Future Scope 68

Bibliography

Page 7
 CHAPTER # 1
Introduction
Contents:

� Introduction
� Objective

Page 8
 Introduction to the System:

Online Examination System is a user friendly, easy to use website where admin can
add courses and objective questions in each course. Student attempt for quiz for check
our course knowledge. A timer runs for given time and within that period one has to
answer for all those questions, some buttons are presented at the bottom of the
window like start button, previous , next , finish.

Objective:
� It provides a less expensive as well as an effective method of performing
examinations.
� It provides best facilities for the students to answer the question only with a single
click.
� It saves time as well as money.
� It lessens the student’s and teacher’s frustration

Page 9
 #

Contents:

� Software requirement
� Hardware requirements

Page 10
 Software Requirements:

� Technology: Python Django

� IDE : Pycharm/Atom
� Client Side Technologies: HTML, CSS, JavaScript , Bootstrap
� Server Side Technologies: Python
� Data Base Server: Sqlite
� Operating System: Microsoft Windows/Linux

Hardware Requirements:

� Processor - 2.0 GHz or above.

� 2 GB RAM or more.

� 160 GB or more Hard Disk Drive.

Page 11
 CHAPTER # 3
Modules

Admin Modules :
ADD COURSES : Admin can add new courses and its quiz time and
marks.

ADD Questions : Admin can add questions and its four option and one
correct answer.

Manage Students

Student Modules :
GIVE EXAM
VIEW RESULT
EDIT PROFILE
Ask Queries

Page 12
 CHAPTER # 4
Implementation issues

HTML

HTML (Hypertext Markup Language) is the set of markup symbols or codes inserted in a file
intended for display on a World Wide Web browser page. The markup tells the Web browser
how to display a Web page's words and images for the user. Each individual markup code is
referred to as an element (but many people also refer to it as a tag). Some elements come in
pairs that indicate when some display effect is to begin and when it is to end.

Page 13
CASCADING STYLE SHEET (CSS)

Cascading Style Sheets (CSS) are a collection of rules we use to define and modify web
pages. CSS are similar to styles in Word. CSS allow Web designers to have much more
control over their pages look and layout. For instance, you could create a style that defines
the body text to be Verdana, 10 point. Later on, you may easily change the body text to Times
New Roman, 12 point by just changing the rule in the CSS. Instead of having to change the
font on each page of your website, all you need to do is redefine the style on the style sheet,
and it will instantly change on all of the pages that the style sheet has been applied to. With
HTML styles, the font change would be applied to each instance of that font and have to be
changed in each spot.

CSS can control the placement of text and objects on your pages as well as the look of those
objects.

HTML information creates the objects (or gives objects meaning), but styles describe how the
objects should appear. The HTML gives your page structure, while the CSS creates the
“presentation”. An external CSS is really just a text file with a .css extension. These files can
be created with Dreamweaver, a CSS editor, or even Notepad.

The best practice is to design your web page on paper first so you know where you will want
to use styles on your page. Then you can create the styles and apply them to your page.

Page 14
LANGUAGE Used :- Python

Python is a widely used general-purpose, high level programming language. It was initially
designed by Guido van Rossum in 1991 and developed by Python Software Foundation. It
was mainly developed for emphasis on code readability, and its syntax allows programmers
to express concepts in fewer lines of code.
Python is a programming language that lets you work quickly and integrate systems more
efficiently.
Python is dynamically typed and garbage-collected. It supports multiple programming
paradigms, including procedural, object-oriented, and functional programming. Python is
often described as a "batteries included" language due to its comprehensive standard library.

Page 15
Django

Django is a web application framework written in Python programming language. It is based

on MVT (Model View Template) design pattern. The Django is very demanding due to its
rapid development feature. It takes less time to build application after collecting client
requirement.

This framework uses a famous tag line:The web framework for perfectionists with
deadlines.

Page 16
SQLite

SQLite3 can be integrated with Python using sqlite3 module, which was written by Gerhard
Haring. It provides an SQL interface compliant with the DB-API 2.0 specification described
by PEP 249. You do not need to install this module separately because it is shipped by
default along with Python version 2.5.x onwards.

To use sqlite3 module, you must first create a connection object that represents the database
and then optionally you can create a cursor object, which will help you in executing all the
SQL statements.

Page 17
 CHAPTER # 5
System Design

Contents:
� Use case diagram
� Sequence Diagram
� Data flow diagram

Page 18
 Use Case Diagram:

� Use case diagram consists of use cases and actors and shows the interaction
between them. The key points are:

� The main purpose is to show the interaction between the use cases and the
actor.

� To represent the system requirement from user’s perspective.

� The use cases are the functions that are to be performed in the module.

Manage Courses

Manage
Questions

�
Manage
ADMIN Students
SYSTEM

Manage
Feedback

Page 19
 Use Case Diagram between ADMIN and SYSTEM:

Fig.5.1

Edit Profile

Give Exam

View Marks

USER Fig.5.2
Send Query SYSTEM

Use Case Diagram between USER and SYSTEM:

Page 20
Sequence Diagram For Administrator:-

Login Application Database

Login
:Request

:Validate()
:executeQuery()

Administrator Response
Show Result

Success:hide() Failed:show()

Fig.5.4

Page 21
Data Flow Diagram

Page 22
FlowChart :

Page 23
Entity Relationship Diagrams (ER-Diagrams):

Page 24
 CHAPTER # 6
User Screens and Report
Output screens

HOME PAGE

Page 25
 ADMIN LOGIN PAGE

Page 26
 ADMIN HOME PAGE

Page 27
 ADD COURSE PAGE

Page 28
 ADD COURSE PAGE

Page 29
 ADD TOPIC PAGE

Page 30
 VIEW TOPICS

Page 31
 ADD QUESTION PAGE

Page 32
 VIEW QUESTIONS

Page 33
 ADD STUDENT PAGE

Page 34
 VIEW STUDENT REPORT PAGE

Page 35
 VIEW STUDENT REPORT PAGE

Page 36
 STUDENT HOME PAGE

Page 37
 VIEW COURSE LIST

Page 38
 VIEW TOPIC LIST

Page 39
 Page 40
 Page 41
 CHAPTER # 7
Coding

HOME PAGE CODING

{% extends 'base.html' %}
{% load static %}
{% block body %}

<div>
<div id="demo" class="carousel slide" data-ride="carousel">

<!-- Indicators -->

<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1"></li>
<li data-target="#demo" data-slide-to="2"></li>
</ul>

<!-- The slideshow -->

<div class="carousel-inner" style="width:1550px;height:350px">
<div class="carousel-item active">
<img src="{% static 'images/quiz.jpg' %}" alt="Los
Angeles"style="height:350px">
</div>
<div class="carousel-item">

Page 42
 <img src="{% static 'images/Quiz1.jpg' %}" alt="Chicago"style="height:350px">
</div>
<div class="carousel-item">
<img src="{% static 'images/QUIz3.jpg' %}" alt="New
York"style="height:350px">
</div>
</div>

<!-- Left and right controls -->

<a class="carousel-control-prev" href="#demo" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#demo" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
</div>
<br><br>
<center>
<h1>Online Quiz System</h1>
</center>
<table width="1000" align="center">
<tr>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
</tr>
<tr>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Page 43
Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
</tr>
</table><hr>
<div style="background-color:GhostWhite;padding:20px">
<table width="1000" align="center">
<tr>
<td><img src="{% static 'images/QUIz3.jpg' %}"
style="width:300px;height:200px"></td>
<td><center><H3>ABOUT ONLINE QUIZ SYSTEM</H3><hr>A quiz is a form of
game or mind sport, in which the players (as individuals or in teams) attempt to answer
questions correctly. It is a game to test your knowledge about a certain subject. ... They
may also involve eliminating those who get too many questions wrong, the winner being
the last man standing.</center></td>

</table><br><br>
</div>

{% endblock %}

Page 44
 ADMIN LOGIN PAGE CODING

{% extends 'base.html' %}
{% load static %}
{% block body %}
{% if error %}
<script>alert('Username or Password is not Matching...')</script>
{% endif %}
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:15px;
text-align:center;
color:white;}

input[type=text], select, textarea {

width: 1130px;
padding: 20px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}
input[type=password], select, textarea {
width: 1130px;
padding: 20px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

label {
Page 45
 padding: 10px 12px 10px 0;
display: inline-block;
}

input[type=submit] {
background-color:DarkSlateGray ;
color: white;
padding: 12px 538px;
border: none;
border-radius: 4px;
cursor: pointer;
margin-top: 80px;
}

input[type=submit]:hover {
background-color: blue;
}

.container {
margin-top:20px;
margin-bottom:20px;
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}

.col-25 {
float: center;
width: 25%;
margin-top: 6px;

.col-75{
Page 46
 float: center;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 600px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
</head>
<body>
<div style="background-color:Darkslategrey;color:white;padding:20px">
<table width="1000" align="center">
<tr><th>TUTOR LOGIN</th>
</tr>
</table>
</div>

<div class="container ">

<center>
<p style="width:1100px" align="center">LOGIN TO YOUR
ACCOUNT</p></center>

Page 47
 <form action="" method="post">
{% csrf_token %}
<div class="row">
<div class="col-25">
<label for="fname"></label>
</div>
<div class="col-100">
<input type="text" id="userid" name="username" placeholder="User Id"><br>
</div>
</div>
<div class="row">
<div class="col-25">
<label for="lname"></label>
</div>
<div class="col-100">
<input type="password" id="password" name="password"
placeholder="Password">
</div>
</div>

<div class="row">
<input type="submit" value="Submit">
</div>
<!-- <h5><a href="{% url 'signuptutor' %}" style="margin-left:380px">>>>> For
New Register Click Here..</a> </h5>-->

</form>
</div>
{% endblock %}

Page 48
 ADMIN HOME PAGE

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">TUTOR DASHBOARD</th>
</tr>
</table>
</div>

<style>
.button {
background-color: DarkSlateGray;
border: 1px solid black;
color: white;
padding: 40px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
margin: 20px 10px;
cursor: pointer;
width:110px;
}

.button1 {border-radius: 50%;}

Page 49
</style>

<div style="padding:70px">
<table width="800" align="center">
<tr><center>
<th style="border:1px solid black;padding:2px"><a href="{% url
'addtopic' %}"><button class="button button1">Add<br>Topics</button></a></th>
<th style="border:1px solid black"><a href="{% url 'addcourse'
%}"><button class="button button1">Add<br>Course</button></a></th>
<th style="border:1px solid black"><a href="{% url 'addquestion'
%}"><button class="button button1">Add<br>Questions</button></a></th>
<th style="border:1px solid black"><a href="{% url 'adduser'
%}"><button class="button button1">Add<br>Users</button></a></th>
<th style="border:1px solid black"><a href="{% url 'tutorreport'
%}"><button class="button button1">Tutors<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'studentreport'
%}"><button class="button button1">Students<br>Report</button></a></th>
</center>
</tr>
<tr>
<th style="border:1px solid black"><a href="{% url 'questionreport'
%}"><button class="button button1">Questions<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'resultreport'
%}"><button class="button button1">Results<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'topicreport'
%}"><button class="button button1">Topics<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myaccount'
request.user.id %}"><button class="button
button1">My<br>Account</button></a></th>
<th style="border:1px solid black"><a href="{% url 'changepassword'
request.user.id %}"><button class="button button1">Change
<br>Password</button></a></th>
Page 50
 <th style="border:1px solid black"><a href="{% url 'logout'
%}"><button class="button button1"
style="height:115px">Logout</button></a></th>
</tr>
</table>
</div>

{% endblock %}

Page 51
 ADD QUESTION PAGE CODING

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">ADD QUESTION</th>
</tr>
</table>
</div>
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:13px;
color:white;
text-align:center}

input[type=text], select, textarea {

width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

label {
padding: 10px 12px 10px 0;
Page 52
 display: inline-block;
}

input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 430px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

input[type=submit]:hover {
background-color: grey;
}

.container {
margin-top:20px;
margin-bottom:20px;
width:900px;
float:center;
border-radius: 5px;
background-color: #f2f2f2;
padding: 28px;

.col-25{
float: left;
Page 53
 width: 25%;
margin-top: 6px;
}

.col-75{
float: left;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 800px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
<div class="container">
<p>Add New Question</p>
<table width="850">

<form action="" method="post">

{% csrf_token %}
<tr>
<th><label for="select topic">Select Course</label>
<select id="topic" name="select_topic">
{% for i in topic %}
Page 54
 <option value="{{i.topic}}">{{i.topic}}[{{i.course.course_name}}]</option>
{% endfor %}
</select></th>
</tr>
<tr>
<th><label for="fullquestion">Full Question</label>
<input type="text" id="fullQuetion" name="fullQuestion" placeholder="Full
Question.."></th>
</tr>
<tr>
<th><label for="option1">Option1</label>
<input type="text" id="option1" name="option1" placeholder="Option1"></th>
<th><label for="option2">Option2</label>
<input type="text" id="option2" name="option2" placeholder="Option2"></th>
</tr>
<tr>
<th><label for="option3">Option3</label>
<input type="text" id="option3" name="option3" placeholder="Option3"></th>
<th><label for="option4">Option4</label>
<input type="text" id="option4" name="option4" placeholder="Option4"></th>
</tr>
<tr>
<th><label for="answer">Answer</label>
<input type="text" id="answer" name="answer" placeholder="Answer"></th>
</tr>

</table>

<input type="submit" value="Submit">

</form>

</div>
{% endblock %}

Page 55
 ADD COURSE CODING

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">ADD COURSE</th>
</tr>
</table>
</div>
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:13px;
color:white;
text-align:center}

input[type=text], select, textarea {

width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

textarea {
width:100%;
height: 150px;
padding: 12px 20px;
Page 56
 box-sizing: border-box;
border: 2px solid #ccc;
border-radius: 4px;
background-color: #f8f8f8;
font-size: 16px;
resize: none;
}

label {
padding: 10px 12px 10px 0;
display: inline-block;
}

input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 430px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

input[type=submit]:hover {
background-color: grey;
}

.container {
margin-top:20px;
margin-bottom:20px;
float:center;
border-radius: 5px;
Page 57
 background-color: #f2f2f2;
padding: 28px;

.col-25{
float: left;
width: 25%;
margin-top: 6px;
}

.col-75{
float: left;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 800px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
<div class="container" style="width:900px">
Page 58
 <p>Add New Course</p>

<form action="" method="post">

{% csrf_token %}

<div class="row">
<div class="col-25">
<label for="regular news"> Course Name</label>
</div>
<div class="col-100">
<input type="text" id="regularnews" name="course" placeholder="Course
Name">
</div>
</div>
<div class="row">
<div class="col-25">
<label for="regular news"> Preparation of the Course </label>
</div>
<textarea name="desc" placeholder="write something about course....."></textarea>
</div>

<div class="row">
<input type="submit" value="Submit">
</div>
</form>
</div>
{% endblock %}

Page 59
 START QUIZ PAGE CODING
{% extends 'base3.html' %}
{% load static %}
{% block body %}
<style>
input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 30px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

</style>
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">TOPIC DETAILS</th>
</tr>
</table>
</div>

<div class="container" style="padding:20px;border:0px solid white">

<form action="" method="post">

{% csrf_token %}
<table class="table" style="border:0px solid white">
<thead style="background-color:DarkSlateGrey;color:white;border-color:white">
<tr><th>Sr. No.</th>
<th>Question</th>
Page 60
 </tr>
</thead>
{% for i in topic %}
<tbody><tr>
<td>{{forloop.counter}}</td>
<td>{{i.question}}</td>
</tr>
</tbody>
<tbody>
<tr><td></td>
<td><input type="radio" name="que{{forloop.counter}}"
value="{{i.option1}}">{{i.option1}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option2}}">{{i.option2}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option3}}">{{i.option3}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option4}}">{{i.option4}}
</td></tr>
</tbody>
{% endfor %}
<tbody><tr>

<td></td>
<td style="float:right"><input type="submit" value="Submit
Quiz"></td></tr></tbody>

</table>
</form>
</div>

{% endblock %}

Page 61
 STUDENT HOME PAGE

{% extends 'base3.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">Student Dashboard</th>
</tr>
</table>
</div>

<style>
.button {
background-color: DarkSlateGray;
border: 1px solid black;
color: white;
padding: 40px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
margin: 20px 10px;
cursor: pointer;
width:110px;
}

.button1 {border-radius: 50%;}

Page 62
</style>

<div style="padding:70px">
<table width="800" align="center">
<tr><center>
<th style="border:1px solid black;padding:2px"><a href="{% url
'courselist' %}"><button class="button button1">Course<br>List</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myaccountstudent'
request.user.id %}"><button class="button
button1">My<br>Account</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myresult'
request.user.id %}"><button class="button
button1">My<br>Result</button></a></th>
<th style="border:1px solid black"><a href="{% url 'changepassword2'
request.user.id %}"><button class="button
button1">Change<br>Password</button></a></th>
<th style="border:1px solid black"><a href="{% url 'logout'
%}"><button class="button button1"
style="height:115px">Logout</button></a></th>
</center>
</tr>
</table>
</div>

{% endblock %}

Page 63
 VIEW RESULT

{% extends 'base3.html' %}
{% load static %}
{% block body %}
<style>
.button {
background-color: LawnGreen;
border: 1px solid black;
color: white;
padding:10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
cursor: pointer;
width:110px;
}

.button1{
border-radius:8%;
border-color:grey
}
</style>
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr>
<th style="color:white">TOPIC DETAILS</th>
</tr>
</table>
</div>
<div class="container" style="padding:20px;border:0px solid white">
<table class="table table-bordered" id="myTable" style="border:0px solid white">
<thead style="background-color:DarkSlateGrey;color:white;border-color:white">
Page 64
 <tr>
<th>Se_No.</th>
<th>Username</th>
<th>Topic Name</th>
<th>Result</th>
<th>Date</th>
<th>Marks</th>
<th>Action</th>
</tr>
</thead>
<tbody style="border-color:white">
{% for i in data %}
<tr>
<td>{{forloop.counter}}</td>
<td>{{i.bhu.user.username}}</td>
<td>{{i.topic.topic}}[{{i.topic.course.course_name}}]</td>
<td>{{i.result}}</td>
<td>{{i.date1}}</td>
<td>{{i.marks}}</td>
<td><a href="{% url 'viewresult' i.id %}"><button class="button button1">View
Result</button></a>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock %}

Page 65
 CHAPTER # 8
Advantages & Limitations

Advantages of “Online Examination System”:

An online examination system has plenty of advantages:

1. It saves paper.
You never have to print an exam for your students and hand them out. Saves paper.
Saves trees. Everybody happy.
2. It saves time.
You can setup an exam in such a way that it will auto-grade itself. If you only use
multiple choice questions you never have to check an exam again. The online exam
system will take care of that hassle. Completly automated.
3. It saves more time.
The distribution of the exam doens't take you any time. Just upload the email
addressess of your students and send them an invite. And after the exam they get their
result instantly.
4. It saves you money.
You don't need to buy any paper. Sending an email is free. On top of that you save on
the logistics: your students don't have to assemble in classroom to take the exam.
They can do it within a given time frame from their own device. You don't have to
rent a classroom. You don't have to hire someone to check the students taking the
exam.
5. It saves the student money.
Students don't have to travel to a specific location to conduct the exam. So even for
students from remote area's it's possible to take the exam.
6. It's more secure.
You can make a big question bank with a lot of questions. Every student gets a
random selection from that question bank. So it's of little use to share the questions
among the exam takers to give them a head start. Try that on paper ;)

Page 66
 Limitations of “Online Examination System”:
Besides the above achievements and the successful completion of the project, we still
feel the project has some limitations, listed as below:

1. It is not a large scale system.

2. Only limited information provided by this system.
3. Since it is an online project, customers need internet connection to use it.
4. People who are not familiar with computers can’t use this software.

Page 67
 CHAPTER # 8
Future Scope

FUTURE SCOPE

This web application involves almost all the features of the online examination. The future
implementation will be online help for the users and chatting with website administrator.

CONCLUSION

The project entitled “Online Examination System” is developed using HTML and CSS as
front end and Python and Sqlite database in back end to computerize the process. This project
covers only the basic features required.

Page 68
 Bibliography

REFERENCES

� WEB REFERENCE

� Wikipedia

� https://www.geeksforgeeks.org/python-django/

� https://www.javatpoint.com

� https://www.python.org/

� https://www.tutorialspoint/

� REFERENCE BOOKS

Two scoops of Django for 1.11 by Daniel Greenfeld’s and Audrey

Greenfield

Lightweight Django by Elman and Mark Lavin

Page 69
This document was created with the Win2PDF “print to PDF” printer available at
http://www.win2pdf.com
This version of Win2PDF 10 is for evaluation and non-commercial use only.
This page will not be added after purchasing Win2PDF.
http://www.win2pdf.com/purchase/
 Practical File
For
AISSCE 2019-20 Examination
As a part of the Informatics Practices Course (065)

SUBMITTED BY:
Iqra Aslam

Under the Guidance of:

Ms. Ayushi Aggarwal (PGT Comp Sc.)
SALWAN GIRLS SR. SEC. SCHOOL
(Old Rajender Nagar, Delhi -110060)

Page 1
 DECLARATION
This is to certify t h at IQ RA ASLAM, of 12 t h B on the
research on t he ONLI NE EXAMINATI ON SYSTEM
under t he guidance of M iss. Ayushi H.S Aggarwal
durin gt he year 2019-20.

Page 2
 CERTIFICATE
This is to certify t h at IQ RA ASLAM, of 12 t h B on the
research on t he ONLI NE EXAMINATI ON SYSTEM
under t he guidance of M iss. Ayushi H.S Aggarwal
durin gt he year 2019-20.

Page 3
 ACKNOWLEDGEMENT

We would like to express our special thanks of gratitude to our teacher who gave me the golden
opportunity to do this wonderful project on the topic Online Examination System on python, which
also helped us in doing a lot of research and we came to know about so many new things.We are
really thankful to them.
We would like to thank God, for Her unending grace and love throughout our academic life. Without
it, I would not have made it this far. We would also like to thank our families for their help and
understanding throughout or academic life.
Again we would also like to thank our friends who helped us a lot in finalizing this project within the
limited time frame.
This project really helped us to learn skills of python and its functionality. I gained a lot of
knowledge while completing this project.
At last we are thankful to each and every person who helped us in completing this project.

Page 4
 AIM OF THE PROJECT

We would like to express our special thanks of gratitude to our teacher who gave me the golden
opportunity to do this wonderful project on the topic Online Examination System on python, which
also helped us in doing a lot of research and we came to know about so many new things.We are
really thankful to them.
We would like to thank God, for Her unending grace and love throughout our academic life. Without
it, I would not have made it this far. We would also like to thank our families for their help and
understanding throughout or academic life.
Again we would also like to thank our friends who helped us a lot in finalizing this project within the
limited time frame.
This project really helped us to learn skills of python and its functionality. I gained a lot of
knowledge while completing this project.
At last we are thankful to each and every person who helped us in completing this project.

Page 5
 Page No.

Chapter 1. Introduction

1) Introduction to the System 8

2) Objective 9

Chapter 2. Hardware and Software requirement

1) Software requirement 10
2) Hardware requirements 11

Chapter 3. Modules

1) Admin Module 12
2) User Module 12

Chapter 4.Implementation issues

1) HTML 13
2) Cascading style sheet(CSS) 14
3) Python 15
4) Django 16
5) Sqlite 17

Chapter 5. System Design

1) Introduction 21
2) Conceptual Design 22
3) ER-Diagram 23

Page 6
 4) Logical Design 23
5) Physical Design 24
6) Data Flow Diagram “Online Examination System” 24

Chapter 6.User Screens 25-41

Chapter 7.Coding 42-65

Chapter 8. Conclusion
1) Benefits Accrued from “Online Examination System” 66
2) Limitations of “Online Examination System” 67

Chapter 9. Future Scope

1) Future Scope 68

Bibliography

Page 7
 CHAPTER # 1
Introduction
Contents:

� Introduction
� Objective

Page 8
 Introduction to the System:

Online Examination System is a user friendly, easy to use website where admin can
add courses and objective questions in each course. Student attempt for quiz for check
our course knowledge. A timer runs for given time and within that period one has to
answer for all those questions, some buttons are presented at the bottom of the
window like start button, previous , next , finish.

Objective:
� It provides a less expensive as well as an effective method of performing
examinations.
� It provides best facilities for the students to answer the question only with a single
click.
� It saves time as well as money.
� It lessens the student’s and teacher’s frustration

Page 9
 #

Contents:

� Software requirement
� Hardware requirements

Page 10
 Software Requirements:

� Technology: Python Django

� IDE : Pycharm/Atom
� Client Side Technologies: HTML, CSS, JavaScript , Bootstrap
� Server Side Technologies: Python
� Data Base Server: Sqlite
� Operating System: Microsoft Windows/Linux

Hardware Requirements:

� Processor - 2.0 GHz or above.

� 2 GB RAM or more.

� 160 GB or more Hard Disk Drive.

Page 11
 CHAPTER # 3
Modules

Admin Modules :
ADD COURSES : Admin can add new courses and its quiz time and
marks.

ADD Questions : Admin can add questions and its four option and one
correct answer.

Manage Students

Student Modules :
GIVE EXAM
VIEW RESULT
EDIT PROFILE
Ask Queries

Page 12
 CHAPTER # 4
Implementation issues

HTML

HTML (Hypertext Markup Language) is the set of markup symbols or codes inserted in a file
intended for display on a World Wide Web browser page. The markup tells the Web browser
how to display a Web page's words and images for the user. Each individual markup code is
referred to as an element (but many people also refer to it as a tag). Some elements come in
pairs that indicate when some display effect is to begin and when it is to end.

Page 13
CASCADING STYLE SHEET (CSS)

Cascading Style Sheets (CSS) are a collection of rules we use to define and modify web
pages. CSS are similar to styles in Word. CSS allow Web designers to have much more
control over their pages look and layout. For instance, you could create a style that defines
the body text to be Verdana, 10 point. Later on, you may easily change the body text to Times
New Roman, 12 point by just changing the rule in the CSS. Instead of having to change the
font on each page of your website, all you need to do is redefine the style on the style sheet,
and it will instantly change on all of the pages that the style sheet has been applied to. With
HTML styles, the font change would be applied to each instance of that font and have to be
changed in each spot.

CSS can control the placement of text and objects on your pages as well as the look of those
objects.

HTML information creates the objects (or gives objects meaning), but styles describe how the
objects should appear. The HTML gives your page structure, while the CSS creates the
“presentation”. An external CSS is really just a text file with a .css extension. These files can
be created with Dreamweaver, a CSS editor, or even Notepad.

The best practice is to design your web page on paper first so you know where you will want
to use styles on your page. Then you can create the styles and apply them to your page.

Page 14
LANGUAGE Used :- Python

Python is a widely used general-purpose, high level programming language. It was initially
designed by Guido van Rossum in 1991 and developed by Python Software Foundation. It
was mainly developed for emphasis on code readability, and its syntax allows programmers
to express concepts in fewer lines of code.
Python is a programming language that lets you work quickly and integrate systems more
efficiently.
Python is dynamically typed and garbage-collected. It supports multiple programming
paradigms, including procedural, object-oriented, and functional programming. Python is
often described as a "batteries included" language due to its comprehensive standard library.

Page 15
Django

Django is a web application framework written in Python programming language. It is based

on MVT (Model View Template) design pattern. The Django is very demanding due to its
rapid development feature. It takes less time to build application after collecting client
requirement.

This framework uses a famous tag line:The web framework for perfectionists with
deadlines.

Page 16
SQLite

SQLite3 can be integrated with Python using sqlite3 module, which was written by Gerhard
Haring. It provides an SQL interface compliant with the DB-API 2.0 specification described
by PEP 249. You do not need to install this module separately because it is shipped by
default along with Python version 2.5.x onwards.

To use sqlite3 module, you must first create a connection object that represents the database
and then optionally you can create a cursor object, which will help you in executing all the
SQL statements.

Page 17
 CHAPTER # 5
System Design

Contents:
� Use case diagram
� Sequence Diagram
� Data flow diagram

Page 18
 Use Case Diagram:

� Use case diagram consists of use cases and actors and shows the interaction
between them. The key points are:

� The main purpose is to show the interaction between the use cases and the
actor.

� To represent the system requirement from user’s perspective.

� The use cases are the functions that are to be performed in the module.

Manage Courses

Manage
Questions

�
Manage
ADMIN Students
SYSTEM

Manage
Feedback

Page 19
 Use Case Diagram between ADMIN and SYSTEM:

Fig.5.1

Edit Profile

Give Exam

View Marks

USER Fig.5.2
Send Query SYSTEM

Use Case Diagram between USER and SYSTEM:

Page 20
Sequence Diagram For Administrator:-

Login Application Database

Login
:Request

:Validate()
:executeQuery()

Administrator Response
Show Result

Success:hide() Failed:show()

Fig.5.4

Page 21
Data Flow Diagram

Page 22
FlowChart :

Page 23
Entity Relationship Diagrams (ER-Diagrams):

Page 24
 CHAPTER # 6
User Screens and Report
Output screens

HOME PAGE

Page 25
 ADMIN LOGIN PAGE

Page 26
 ADMIN HOME PAGE

Page 27
 ADD COURSE PAGE

Page 28
 ADD COURSE PAGE

Page 29
 ADD TOPIC PAGE

Page 30
 VIEW TOPICS

Page 31
 ADD QUESTION PAGE

Page 32
 VIEW QUESTIONS

Page 33
 ADD STUDENT PAGE

Page 34
 VIEW STUDENT REPORT PAGE

Page 35
 VIEW STUDENT REPORT PAGE

Page 36
 STUDENT HOME PAGE

Page 37
 VIEW COURSE LIST

Page 38
 VIEW TOPIC LIST

Page 39
 Page 40
 Page 41
 CHAPTER # 7
Coding

HOME PAGE CODING

{% extends 'base.html' %}
{% load static %}
{% block body %}

<div>
<div id="demo" class="carousel slide" data-ride="carousel">

<!-- Indicators -->

<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1"></li>
<li data-target="#demo" data-slide-to="2"></li>
</ul>

<!-- The slideshow -->

<div class="carousel-inner" style="width:1550px;height:350px">
<div class="carousel-item active">
<img src="{% static 'images/quiz.jpg' %}" alt="Los
Angeles"style="height:350px">
</div>
<div class="carousel-item">

Page 42
 <img src="{% static 'images/Quiz1.jpg' %}" alt="Chicago"style="height:350px">
</div>
<div class="carousel-item">
<img src="{% static 'images/QUIz3.jpg' %}" alt="New
York"style="height:350px">
</div>
</div>

<!-- Left and right controls -->

<a class="carousel-control-prev" href="#demo" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#demo" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
</div>
<br><br>
<center>
<h1>Online Quiz System</h1>
</center>
<table width="1000" align="center">
<tr>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
<td><img src="{% static 'images/quiz.jpg' %}"
style="width:200px;height:100px"></td>
</tr>
<tr>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Page 43
Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
<td>You can add pictures to all question types available for quizzes. It’s very easy to
add images to your questions.

Go to your quiz questions, click to add a new question (or editing a question you already
have), and you'll see a place where you can add an images to your question.</td>
</tr>
</table><hr>
<div style="background-color:GhostWhite;padding:20px">
<table width="1000" align="center">
<tr>
<td><img src="{% static 'images/QUIz3.jpg' %}"
style="width:300px;height:200px"></td>
<td><center><H3>ABOUT ONLINE QUIZ SYSTEM</H3><hr>A quiz is a form of
game or mind sport, in which the players (as individuals or in teams) attempt to answer
questions correctly. It is a game to test your knowledge about a certain subject. ... They
may also involve eliminating those who get too many questions wrong, the winner being
the last man standing.</center></td>

</table><br><br>
</div>

{% endblock %}

Page 44
 ADMIN LOGIN PAGE CODING

{% extends 'base.html' %}
{% load static %}
{% block body %}
{% if error %}
<script>alert('Username or Password is not Matching...')</script>
{% endif %}
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:15px;
text-align:center;
color:white;}

input[type=text], select, textarea {

width: 1130px;
padding: 20px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}
input[type=password], select, textarea {
width: 1130px;
padding: 20px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

label {
Page 45
 padding: 10px 12px 10px 0;
display: inline-block;
}

input[type=submit] {
background-color:DarkSlateGray ;
color: white;
padding: 12px 538px;
border: none;
border-radius: 4px;
cursor: pointer;
margin-top: 80px;
}

input[type=submit]:hover {
background-color: blue;
}

.container {
margin-top:20px;
margin-bottom:20px;
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}

.col-25 {
float: center;
width: 25%;
margin-top: 6px;

.col-75{
Page 46
 float: center;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 600px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
</head>
<body>
<div style="background-color:Darkslategrey;color:white;padding:20px">
<table width="1000" align="center">
<tr><th>TUTOR LOGIN</th>
</tr>
</table>
</div>

<div class="container ">

<center>
<p style="width:1100px" align="center">LOGIN TO YOUR
ACCOUNT</p></center>

Page 47
 <form action="" method="post">
{% csrf_token %}
<div class="row">
<div class="col-25">
<label for="fname"></label>
</div>
<div class="col-100">
<input type="text" id="userid" name="username" placeholder="User Id"><br>
</div>
</div>
<div class="row">
<div class="col-25">
<label for="lname"></label>
</div>
<div class="col-100">
<input type="password" id="password" name="password"
placeholder="Password">
</div>
</div>

<div class="row">
<input type="submit" value="Submit">
</div>
<!-- <h5><a href="{% url 'signuptutor' %}" style="margin-left:380px">>>>> For
New Register Click Here..</a> </h5>-->

</form>
</div>
{% endblock %}

Page 48
 ADMIN HOME PAGE

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">TUTOR DASHBOARD</th>
</tr>
</table>
</div>

<style>
.button {
background-color: DarkSlateGray;
border: 1px solid black;
color: white;
padding: 40px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
margin: 20px 10px;
cursor: pointer;
width:110px;
}

.button1 {border-radius: 50%;}

Page 49
</style>

<div style="padding:70px">
<table width="800" align="center">
<tr><center>
<th style="border:1px solid black;padding:2px"><a href="{% url
'addtopic' %}"><button class="button button1">Add<br>Topics</button></a></th>
<th style="border:1px solid black"><a href="{% url 'addcourse'
%}"><button class="button button1">Add<br>Course</button></a></th>
<th style="border:1px solid black"><a href="{% url 'addquestion'
%}"><button class="button button1">Add<br>Questions</button></a></th>
<th style="border:1px solid black"><a href="{% url 'adduser'
%}"><button class="button button1">Add<br>Users</button></a></th>
<th style="border:1px solid black"><a href="{% url 'tutorreport'
%}"><button class="button button1">Tutors<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'studentreport'
%}"><button class="button button1">Students<br>Report</button></a></th>
</center>
</tr>
<tr>
<th style="border:1px solid black"><a href="{% url 'questionreport'
%}"><button class="button button1">Questions<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'resultreport'
%}"><button class="button button1">Results<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'topicreport'
%}"><button class="button button1">Topics<br>Report</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myaccount'
request.user.id %}"><button class="button
button1">My<br>Account</button></a></th>
<th style="border:1px solid black"><a href="{% url 'changepassword'
request.user.id %}"><button class="button button1">Change
<br>Password</button></a></th>
Page 50
 <th style="border:1px solid black"><a href="{% url 'logout'
%}"><button class="button button1"
style="height:115px">Logout</button></a></th>
</tr>
</table>
</div>

{% endblock %}

Page 51
 ADD QUESTION PAGE CODING

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">ADD QUESTION</th>
</tr>
</table>
</div>
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:13px;
color:white;
text-align:center}

input[type=text], select, textarea {

width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

label {
padding: 10px 12px 10px 0;
Page 52
 display: inline-block;
}

input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 430px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

input[type=submit]:hover {
background-color: grey;
}

.container {
margin-top:20px;
margin-bottom:20px;
width:900px;
float:center;
border-radius: 5px;
background-color: #f2f2f2;
padding: 28px;

.col-25{
float: left;
Page 53
 width: 25%;
margin-top: 6px;
}

.col-75{
float: left;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 800px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
<div class="container">
<p>Add New Question</p>
<table width="850">

<form action="" method="post">

{% csrf_token %}
<tr>
<th><label for="select topic">Select Course</label>
<select id="topic" name="select_topic">
{% for i in topic %}
Page 54
 <option value="{{i.topic}}">{{i.topic}}[{{i.course.course_name}}]</option>
{% endfor %}
</select></th>
</tr>
<tr>
<th><label for="fullquestion">Full Question</label>
<input type="text" id="fullQuetion" name="fullQuestion" placeholder="Full
Question.."></th>
</tr>
<tr>
<th><label for="option1">Option1</label>
<input type="text" id="option1" name="option1" placeholder="Option1"></th>
<th><label for="option2">Option2</label>
<input type="text" id="option2" name="option2" placeholder="Option2"></th>
</tr>
<tr>
<th><label for="option3">Option3</label>
<input type="text" id="option3" name="option3" placeholder="Option3"></th>
<th><label for="option4">Option4</label>
<input type="text" id="option4" name="option4" placeholder="Option4"></th>
</tr>
<tr>
<th><label for="answer">Answer</label>
<input type="text" id="answer" name="answer" placeholder="Answer"></th>
</tr>

</table>

<input type="submit" value="Submit">

</form>

</div>
{% endblock %}

Page 55
 ADD COURSE CODING

{% extends 'base2.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">ADD COURSE</th>
</tr>
</table>
</div>
<style>
*{
box-sizing: border-box;
}
p{background-color:DarkSlateGray ;
padding:13px;
color:white;
text-align:center}

input[type=text], select, textarea {

width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

textarea {
width:100%;
height: 150px;
padding: 12px 20px;
Page 56
 box-sizing: border-box;
border: 2px solid #ccc;
border-radius: 4px;
background-color: #f8f8f8;
font-size: 16px;
resize: none;
}

label {
padding: 10px 12px 10px 0;
display: inline-block;
}

input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 430px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

input[type=submit]:hover {
background-color: grey;
}

.container {
margin-top:20px;
margin-bottom:20px;
float:center;
border-radius: 5px;
Page 57
 background-color: #f2f2f2;
padding: 28px;

.col-25{
float: left;
width: 25%;
margin-top: 6px;
}

.col-75{
float: left;
width: 75%;
margin-top: 4px;
}

/* Clear floats after the columns */

.row:after {
content: "";
display: table;
clear: both;
}

@media screen and (max-width: 800px) {

.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}
</style>
<div class="container" style="width:900px">
Page 58
 <p>Add New Course</p>

<form action="" method="post">

{% csrf_token %}

<div class="row">
<div class="col-25">
<label for="regular news"> Course Name</label>
</div>
<div class="col-100">
<input type="text" id="regularnews" name="course" placeholder="Course
Name">
</div>
</div>
<div class="row">
<div class="col-25">
<label for="regular news"> Preparation of the Course </label>
</div>
<textarea name="desc" placeholder="write something about course....."></textarea>
</div>

<div class="row">
<input type="submit" value="Submit">
</div>
</form>
</div>
{% endblock %}

Page 59
 START QUIZ PAGE CODING
{% extends 'base3.html' %}
{% load static %}
{% block body %}
<style>
input[type=submit] {
width:100%;
background-color:DarkSlateGray ;
color: white;
padding:12px 30px;
border: none;
border-radius: 4px;
cursor: pointer;
float:center;
margin-top: 25px;
}

</style>
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">TOPIC DETAILS</th>
</tr>
</table>
</div>

<div class="container" style="padding:20px;border:0px solid white">

<form action="" method="post">

{% csrf_token %}
<table class="table" style="border:0px solid white">
<thead style="background-color:DarkSlateGrey;color:white;border-color:white">
<tr><th>Sr. No.</th>
<th>Question</th>
Page 60
 </tr>
</thead>
{% for i in topic %}
<tbody><tr>
<td>{{forloop.counter}}</td>
<td>{{i.question}}</td>
</tr>
</tbody>
<tbody>
<tr><td></td>
<td><input type="radio" name="que{{forloop.counter}}"
value="{{i.option1}}">{{i.option1}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option2}}">{{i.option2}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option3}}">{{i.option3}}<br>
<input type="radio" name="que{{forloop.counter}}"
value="{{i.option4}}">{{i.option4}}
</td></tr>
</tbody>
{% endfor %}
<tbody><tr>

<td></td>
<td style="float:right"><input type="submit" value="Submit
Quiz"></td></tr></tbody>

</table>
</form>
</div>

{% endblock %}

Page 61
 STUDENT HOME PAGE

{% extends 'base3.html' %}
{% load static %}
{% block body %}
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr><th style="color:white">Student Dashboard</th>
</tr>
</table>
</div>

<style>
.button {
background-color: DarkSlateGray;
border: 1px solid black;
color: white;
padding: 40px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
margin: 20px 10px;
cursor: pointer;
width:110px;
}

.button1 {border-radius: 50%;}

Page 62
</style>

<div style="padding:70px">
<table width="800" align="center">
<tr><center>
<th style="border:1px solid black;padding:2px"><a href="{% url
'courselist' %}"><button class="button button1">Course<br>List</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myaccountstudent'
request.user.id %}"><button class="button
button1">My<br>Account</button></a></th>
<th style="border:1px solid black"><a href="{% url 'myresult'
request.user.id %}"><button class="button
button1">My<br>Result</button></a></th>
<th style="border:1px solid black"><a href="{% url 'changepassword2'
request.user.id %}"><button class="button
button1">Change<br>Password</button></a></th>
<th style="border:1px solid black"><a href="{% url 'logout'
%}"><button class="button button1"
style="height:115px">Logout</button></a></th>
</center>
</tr>
</table>
</div>

{% endblock %}

Page 63
 VIEW RESULT

{% extends 'base3.html' %}
{% load static %}
{% block body %}
<style>
.button {
background-color: LawnGreen;
border: 1px solid black;
color: white;
padding:10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 10px;
cursor: pointer;
width:110px;
}

.button1{
border-radius:8%;
border-color:grey
}
</style>
<div style="background-color:DarkSlateGrey;padding:20px">
<table width="1000" align="center">
<tr>
<th style="color:white">TOPIC DETAILS</th>
</tr>
</table>
</div>
<div class="container" style="padding:20px;border:0px solid white">
<table class="table table-bordered" id="myTable" style="border:0px solid white">
<thead style="background-color:DarkSlateGrey;color:white;border-color:white">
Page 64
 <tr>
<th>Se_No.</th>
<th>Username</th>
<th>Topic Name</th>
<th>Result</th>
<th>Date</th>
<th>Marks</th>
<th>Action</th>
</tr>
</thead>
<tbody style="border-color:white">
{% for i in data %}
<tr>
<td>{{forloop.counter}}</td>
<td>{{i.bhu.user.username}}</td>
<td>{{i.topic.topic}}[{{i.topic.course.course_name}}]</td>
<td>{{i.result}}</td>
<td>{{i.date1}}</td>
<td>{{i.marks}}</td>
<td><a href="{% url 'viewresult' i.id %}"><button class="button button1">View
Result</button></a>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock %}

Page 65
 CHAPTER # 8
Advantages & Limitations

Advantages of “Online Examination System”:

An online examination system has plenty of advantages:

1. It saves paper.
You never have to print an exam for your students and hand them out. Saves paper.
Saves trees. Everybody happy.
2. It saves time.
You can setup an exam in such a way that it will auto-grade itself. If you only use
multiple choice questions you never have to check an exam again. The online exam
system will take care of that hassle. Completly automated.
3. It saves more time.
The distribution of the exam doens't take you any time. Just upload the email
addressess of your students and send them an invite. And after the exam they get their
result instantly.
4. It saves you money.
You don't need to buy any paper. Sending an email is free. On top of that you save on
the logistics: your students don't have to assemble in classroom to take the exam.
They can do it within a given time frame from their own device. You don't have to
rent a classroom. You don't have to hire someone to check the students taking the
exam.
5. It saves the student money.
Students don't have to travel to a specific location to conduct the exam. So even for
students from remote area's it's possible to take the exam.
6. It's more secure.
You can make a big question bank with a lot of questions. Every student gets a
random selection from that question bank. So it's of little use to share the questions
among the exam takers to give them a head start. Try that on paper ;)

Page 66
 Limitations of “Online Examination System”:
Besides the above achievements and the successful completion of the project, we still
feel the project has some limitations, listed as below:

1. It is not a large scale system.

2. Only limited information provided by this system.
3. Since it is an online project, customers need internet connection to use it.
4. People who are not familiar with computers can’t use this software.

Page 67
 CHAPTER # 8
Future Scope

FUTURE SCOPE

This web application involves almost all the features of the online examination. The future
implementation will be online help for the users and chatting with website administrator.

CONCLUSION

The project entitled “Online Examination System” is developed using HTML and CSS as
front end and Python and Sqlite database in back end to computerize the process. This project
covers only the basic features required.

Page 68
 Bibliography

REFERENCES

� WEB REFERENCE

� Wikipedia

� https://www.geeksforgeeks.org/python-django/

� https://www.javatpoint.com

� https://www.python.org/

� https://www.tutorialspoint/

� REFERENCE BOOKS

Two scoops of Django for 1.11 by Daniel Greenfeld’s and Audrey

Greenfield

Lightweight Django by Elman and Mark Lavin

Page 69
This document was created with the Win2PDF “print to PDF” printer available at
http://www.win2pdf.com
This version of Win2PDF 10 is for evaluation and non-commercial use only.
This page will not be added after purchasing Win2PDF.
http://www.win2pdf.com/purchase/