Șef lucrări dr. ing. Stefan Udristoiu SEPTEMBRIE 2019 CRAIOVA ii UNIVERSITATEA DIN CRAIOVA FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI ELECTRONICĂ… [604781]

i

UNIVERSITATEA DIN CRAIOVA
FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI
ELECTRONICĂ

DEPARTAMENTUL DE CALCULATOARE ȘI TEHNOLOGIA
INFORMAȚIEI

LUCRARE DE DI SERTAȚIE
Cirjaliu Alina -Maria

COORDONATOR ȘTIINȚIFIC
Șef lucrări dr. ing. Stefan Udristoiu

SEPTEMBRIE 2019
CRAIOVA

ii

UNIVERSITATEA DIN CRAIOVA
FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI
ELECTRONICĂ

DEPARTAMENTUL DE CALCULATOARE ȘI TEHNOLOGIA
INFORMAȚIEI

HOSPITAL MANAGEMENT SYSTEM
Cirjaliu Alina -Maria

COORDONATOR ȘTIINȚIFI C
Șef lucrări dr. ing. Stefan Udristoiu

SEPTEMBRIE 2019
CRAIOVA

iii
„An investment in knowledge pays the best interest .”
Benjamin Franklin

iv
DECLARAȚIE DE ORIGINALITATE

Subsemnatul Cirja liu Alina -Maria , student: [anonimizat], Calculatoare și Electronică a Universit ății din Craiova, certific prin preze nta că am luat la
cunoșt ință de cele prezentate mai jos și că î mi asum, în acest context, originalita tea lucrării mele de
disertație :
 cu titlul Hospital Management System,
 coordonată de Șef lucrări dr. ing. Stefan -Cristinel Udristoiu ,
 prezentată în sesiunea SEPTEMB RIE 2019 .
La elaborarea lucrării de disertație , se consideră plagiat una dintre următoarele acțiuni:
 reproducerea exactă a cuvintelor unui alt autor, dintr -o altă lucrare, în limba română sau prin
traducere dintr -o altă limbă, dacă se omit ghilimele și re ferința precisă,
 redarea cu alte cuvinte, reformularea prin cuvinte proprii sau rezumarea ideilor din alte
lucrări , dacă nu se indică sursa bibliografică,
 prezentarea unor date experimentale obținute sau a unor aplicații realizate de alți autori fără
menționarea corectă a acestor surse,
 însușirea totală sau parțială a unei lucrări în care regulile de mai sus sunt respectate, dar care
are alt autor.
Pentru evitarea acest or situații neplăcute se recomandă:
 plasarea într e ghilimele a citatelor directe și indicarea referinței într -o listă corespunzătoare la
sfărșitul lucrării,
 indicarea în text a reformulării unei idei, opinii sau teorii și corespunzător în lista de referințe
a sursei originale de la care s -a făcut preluarea,
 precizarea sursei de la care s-au preluat date experimentale, descrieri tehnice, figuri, imagini,
statistici, tabele et caetera ,
 precizarea referințelor poate fi omisă dacă se folosesc informații sau teorii arhicunoscute, a
căror paternitate este unanim cunoscută și acceptată.
Data , Semnătura candidat: [anonimizat] ,

v

UNIVERSITATEA DIN CRAIOVA
Facultatea de Automatică, Calculatoare și Electronică

Departamentul de Calculatoare și Tehnologia Informației
Aprobat la data de
…………………
Șef de departament,
Prof. dr. ing.
Marius BREZOVA N

LUCRARE DE DI SERTAȚIE

Numele și prenumele student: [anonimizat]/ -ei:
Cirjaliu Alina -Maria

Enunțul temei:

Hospital Management System

Datele de pornire:

Promovarea policlinicilor si a spitalelor prin posibilitatea
realizarii programarilor online pe o singură platforma web,
accesibilă tuturor pacientilor.

Conținutul lucrării :

1. Introduction
2. Web application – Interface presentation
3. Web application – Implementation
4. Conclu sions
5. Bibliogra phy

Material grafic obligatoriu:
Capturi de ecran
Secvențe de cod

Consultații:
Periodice
Conducătorul științific
(titlul, nume și prenume, semnătura): Șef lucrări dr. ing. Stefan -Cristinel Udristoiu

Data eliberării temei :
01.12.201 8

Termenul estimat de predare a
lucrării :
01.06.2019

Data predării lucrării de către student
și semnătura acestuia:
01.09.2019

vi

UNIVERSITATEA DIN CRAIOVA
Facultatea de Automatică, Calculatoare și Electronică

Departamentul de Calculatoare și Tehnologia Informației

REFERATUL CONDUCĂTORULUI ȘTIINȚIFIC

Numele și prenumel e candida tului/ -ei: Cirjaliu Alina-Maria
Specializarea: Information Systems for e -Business
Titlul lucrării : Hospital management system
Locația în care s -a realizat practica de
documentare (se bifează una sau mai
multe din opțiunile din dreapta): În facultate □
În producție □
În cercetare □
Altă locație:

În urma analizei lucrării candidatului au fost constatate următoarele:
Nivelul documentării Insuficient
□ Satisfăcător
□ Bine
□ Foarte b ine

Tipul proiectului Cercetare
□ Proiectare
□ Realizare
practică □ Altul

Aparatul matematic utilizat Simplu
□ Mediu
□ Complex
□ Absent

Utilitate Contract de
cercetare □ Cercetare
internă □ Utilare
□ Altul

Redactarea lucrării Insuficient
□ Satisfăcător
□ Bine
□ Foarte bine

Partea grafică, desene Insuficient ă
□ Satisfăcătoare
□ Bună
□ Foarte bună

Realizarea
practică Contribuția autorului Insuficientă
□ Satisfăcătoare
□ Mare
□ Foarte mare

Complexitatea
temei Simplă
□ Medie
□ Mare
□ Complexă

Analiza cerințelor Insuficient
□ Satisfăcător
□ Bine
□ Foarte bine

Arhitectura Simplă
□ Medie
□ Mare
□ Complexă

vii
Întocmirea
specificațiilor
funcționale Insuficientă
□ Satisfăcătoare
□ Bună
□ Foarte bună

Implementarea Insuficientă
□ Satisfăcătoare
□ Bună
□ Foarte bună

Testarea Insuficientă
□ Satisfăcătoare
□ Bună
□ Foarte bună

Funcționarea Da
□ Parțială
□ Nu

Rezultate experimentale Experiment propriu
□ Preluare din bibliografi e

Bibliografie Cărți
Reviste
Articole
Referințe web

Comentarii
și
observații

În concluzie, se propune:

ADMITEREA LUCRĂRII
□ RESPINGEREA LUCRĂRII

Data, Semnătura conducătorului științific,

viii
PAPER SUMMARY
This dissertation paper entitled “Hospital Management System ” presents a web application
created for the purpose of uniting available courses, news regarding technologies, training p rograms,
internship positions as well as available job openings from local It companies as well as companies
from other cities, in a single, easy to acces web platform available for the students of the Automation,
Computer Science and Electronics Faculty o f Craiova.
It was decided that the best option was to create it as a web application because of how easy
to acces s web applications are, being available on almost every device that can connect to the internet
such as personal computers, laptops, mobile pho nes and tablets which is a big advantage over desktop
applications.
There are 3 type of users with different privileges: admin , companies (a representative that is
posting in t he company’s name) and students and the project consists of two modules:
The web app lication (front -end) where all type of users cand enter and access the information
posted by companies as articles and they can comment on those articles to promote interaction
between the companies and the students (for example: a student posting a question in the comments
and then recieving an answer from a company) . Furthermore, the comments have a scoring system
based on likes and dislikes (thumbs up/down) that changes the order of the comments, pushing the
most appreciated ones to the top and th e most disliked ones to the bottom (for example, an answer to a
popular question regarding that article can recieve likes and be displayed as a top comment so new
students cand find the answer easier and even without having to post the question beforehand)
The administration panel (back -end) where only the admin and company type of users have
access to. The admin has to approve the creation of new student or company accounts and has full
rights over all application data like manually add ing a student or a c ompany (as opposed to them
registering on their own and waiting for approval from the admin), edit ing information regarding
existent students or companies or simply deleting them if needed and adding, deleting and editing
articles as well. The company can only add and edit or delete existing owned articles from the
administration panel.
The ideea from which this project started was that A.C.E students should have the possibility
to learn about the opportunities and the options available to them once they g raduate from this Faculty
and that they can get exposed as early as possible to different technologies so they can experiment and
choose a career in their prefered domain.

Termenii cheie : web application , admin , doctors , Technologies, Patients , Opportunities .

ix
Table of contents
1 INTRODUCTION ………………………….. ………………………….. ………………………….. ………………………….. ……. 1
1.1 SCOPE ………………………….. ………………………….. ………………………….. ………………………….. …………… 1
1.2 MOTIVATION ………………………….. ………………………….. ………………………….. ………………………….. …… 1
1.3 APPLICATION WORKFLOW ………………………….. ………………………….. ………………………….. ………………….. 1
1.4 USED TECHNOLOGIES ………………………….. ………………………….. ………………………….. ……………………….. 2
1.4.1 PHP ………………………….. ………………………….. ………………………….. ………………………….. …………. 4
1.4.2 MySQL Database ………………………….. ………………………….. ………………………….. ……………………. 6
1.4.3 HTML ………………………….. ………………………….. ………………………….. ………………………….. ………. 7
1.4.4 CSS (Cascading Style Sheets) ………………………….. ………………………….. ………………………….. …….. 8
1.4.5 JavaScript ………………………….. ………………………….. ………………………….. ………………………….. .. 11
1.4.6 jQuery ………………………….. ………………………….. ………………………….. ………………………….. ……. 14
1.5 APPLICATION ARCHITECT URE ………………………….. ………………………….. ………………………….. …………….. 16
2 WEB APPLICATION – INTERFACE PRESENTATI ON………………………….. ………………………….. ………………. 21
2.1 HOME PAGE ………………………….. ………………………….. ………………………….. ………………………….. ….. 21
2.1.1 Regis ter ………………………….. ………………………….. ………………………….. ………………………….. ….. 22
2.1.2 Login Screen for all tipes of users. ………………………….. ………………………….. ………………………… 24
2.1.3 Log out ………………………….. ………………………….. ………………………….. ………………………….. …… 26
2.1.4 Change Password ………………………….. ………………………….. ………………………….. …………………. 27
2.2 THE DASHBOARD PAGE ………………………….. ………………………….. ………………………….. …………………… 27
2.2.1 Dasboard Page functionalityes for the Admin user ………………………….. ………………………….. ….. 28
2.2.2 Dasboard Page Functionality -Doctor user ………………………….. ………………………….. ……………… 32
2.2.3 Dashboard Page Functionality – Patient user ………………………….. ………………………….. …………. 33
3 WEB APPLICATION – IMPLEMENTATION ………………………….. ………………………….. …………………………. 33
3.1 THE DATABASE ………………………….. ………………………….. ………………………….. ………………………….. … 33
3.2 LOGIN PAGE ………………………….. ………………………….. ………………………….. ………………………….. …… 36
3.2.1 Register ………………………….. ………………………….. ………………………….. ………………………….. ….. 38
3.2.2 Log out ………………………….. ………………………….. ………………………….. ………………………….. …… 40
3.3 CHANGE PASSWORD ………………………….. ………………………….. ………………………….. ……………………… 41
3.4 THE DASHBOARD PAGE – FUCTIONALITIES FOR TH E PATIENT USER ………………………….. ………………………….. .. 43
3.4.1 Book an appointment ………………………….. ………………………….. ………………………….. ……………. 44
3.4.2 Edit Profile ………………………….. ………………………….. ………………………….. ………………………….. . 47
3.4.3 The get doctor ………………………….. ………………………….. ………………………….. ……………………… 48
3.4.4 Get Fees ………………………….. ………………………….. ………………………….. ………………………….. …. 48

x
3.5 THE DASHBOARD PAGE – FUCTIONALITIES F OR THE ADMIN USER ………………………….. ………………………….. … 49
3.5.1 Add Doctor ………………………….. ………………………….. ………………………….. ………………………….. 51
3.5.2 Doctor Specialization ………………………….. ………………………….. ………………………….. …………….. 54
3.5.3 Edit Doctor ………………………….. ………………………….. ………………………….. ………………………….. 58
3.5.4 Edit Specialization ………………………….. ………………………….. ………………………….. …………………. 59
3.6 THE DASHBOARD PAGE – FUCTIONALITIES FOR TH E DOCTOR USER ………………………….. ………………………….. . 59
3.6.1 Appointment History ………………………….. ………………………….. ………………………….. ……………… 60
4 CONCLUSIONS ………………………….. ………………………….. ………………………….. ………………………….. ……. 64
5 BIBLIOGRAPHY ………………………….. ………………………….. ………………………….. ………………………….. …… 66
A. SOURCE CODE ………………………….. ………………………….. ………………………….. ………………………….. ……. 67
B. CD / DVD ………………………….. ………………………….. ………………………….. ………………………….. …………… 82

xi
LIST OF FIGURES
FIGURE 1 JAVASCRIPT IN BROWSER ………………………….. ………………………….. ………………………….. ……………………. 13
FIGURE 2. THE ROOT COMPONENT ………………………….. ………………………….. ………………………….. …………………….. 16
FIGURE 3. ASSETS DIRECTORY ………………………….. ………………………….. ………………………….. ………………………….. . 18
FIGURE 4. APPLICATION DIRECTORY ………………………….. ………………………….. ………………………….. ……………………. 19
FIGURE 5. ADMIN DIRECTORY ………………………….. ………………………….. ………………………….. ………………………….. . 20

xii
LIST OF TABLES
TABLE 1. THE DATABASE ………………………….. ………………………….. ………………………….. ………………………….. ……. 35

1
1 INTRODU CTION
1.1 Scop e
The scope of this dissertation project is to ease the doctors appoitment procedure. Promote
interaction between patients and doctors by having a web platform where as a doctor you can post
about the consultation fees, clinical examination, doctors specialization working days and hours.
1.2 Motiva tion
Patiens has to do more actions for beeing able to book a doctor consultation. By de veloping this
web application the operations for booking a doctor appointmen are simplyfied. The patients user has
to register an account, login in the web application and book an appoiment to the doctor they choose.
Also for doctors the proces is simplyfi ed, the doctors can view the appoiment history, set up the fees
for the consultation and view the schedule for the week, also they can cancel an appoiment if is
necesarry.
1.3 Application workflow
The Hospital Management System Application is divided into three sections each section for
each type of user: admin section, doctors section and patients section.
The back -end is accessible to the Admin user . This does not mean, however, that the same
category of users have the same rights. Administrator, of course , has full rights over all application
data, starting wit h the approval of new doctors, doctor specialization or patients wishing to join this
web application and even deleting and editing existing accounts . On the other hand, doctors only have
editing / de leting rights on their own accounts and registered appoiments .
The front -end is equally accessible to patients . Here, patients can book doctor appointments
posted by the admin user based on certain filters ( doctor specialization, alavabile booking days and
hours ).

2
1.4 Used technologies
In the web domain, there are two great concepts – client and server. The client or web browser
is the terminal where the user receives the information served by the server through a protocol. Most
commonly used is the Hype rtext Transfer Protocol (HTTP) protocol.
The application of this dissertation works on both the client a nd the server. Therefore, a series
of main and secondary technologies (somewhat complementing the main features) that run on both
the client and the ser ver have been used.
For the client side, the following technologies are used:

 HTML 5 – HTML or Hyper Text Markup Language is the standard language for displaying
web pages. It is a markup language because it uses bookmarks / tags to store / organize /
display the information to the client / browser. Version 5 is currently the latest language
version, offering far more features for today's technologies .
 CSS 3 – CSS or Cascade Style Sheet is the language that handles the design of HTML
elements / tags. The l atest version, 3, offers many features compared to the previous
version, most of which are found on the mobile market segment (smartphone / tablet
browsers).
 JavaScript – is the standard web scripting language. Scripts produce actions that allow for
better interaction of the user with the website. Like HTML and CSS, JavaScript runs
directly into the browser so all three of these languages do not require external libraries /
dependencies.
 jQuery – jQuery is one of the most popular client -side JavaScript fr ameworks. With this
framework, the DOM Objects (Document Object Model) can be manipulated very easily
using the CSS syntax (# for id and class for classes). The version used is 1.11, this being
the most stable at this time.
 Bootstrap – Bootstrap i s another framework, but it is for design purposes. Using CSS3 for
design and jQuery for functionalities. It is one of the most popular frameworks of its kind
at this time, thanks to well -defined classes, easy -to-use functionalities, and especially for
responsive d esign (the elements of the web page are folded so that they appear well both on
a resolution computer and mobile resolution – smartphone or tablet). Both the management
panel and the teaching staff panel are 100% accomplished within this framework. The
source of the administration panel is https://colorlib.com/polygon/elaadmin/index.html and
the front end is https://www.themeineed.com/downloads/bravana -lite-free-bootstrap –
business -template

3
 Other JavaScript plugins: jQuery nicescroll, jQuery timepicker, sel ect2, jQuery
metisMenu, jQuery slimscroll, screenfull + related CSS files. These plug -ins are related to
the design of certain elements and a better user experience on the site.

For the server side, the following technologies were used:

 PHP – PHP: Hypert ext Preprocessor is one of the most popular / popular scripting
languages on the server in the world. Why? Because it is open -source (anyone can
contribute to its development) so it's free, it has a very large and active community, it runs
directly on th e server and its download and installation is very fast. This language is the
primary rival of scripting language on ASP.net (Microsoft).

MySQL has been used as the DBMS (Database Management System). It is the most popular
open -source relational database DBMS, currently available.
To work with PHP and MySQL, the XAMPP environment (Apache + Maria DB + PHP + Perl)
was installed. This is a popular platform for developing a project in the Windows operating system, a
project that uses PHP and MySQL. Practically , using this deployment environment, an offline server
is configured on its own computer with Apache (the most popular / used open source HTTP server in
the world). At the same time, PHP, MySQL and a database management system called PHPMyAdmin
are also in stalled in this environment. This platform allows us to create and run a web application that
uses PHP and MySQL.

As an integrated software development environment, PhpStorm was used. This is a very
powerful IDE on PHP but also on the other client -side technologies mentioned above.
Google Chrome (together with Developer Tools) and Mozilla Firefox (along with Firebug)
have been used to test the app.

4
1.4.1 PHP
PHP (Hypertext Preprocessor) started out as a small open source project that evolved as more and
more people found out how useful it was. Rasmus Lerdorf unleashed the first version of PHP way
back in 1994.
PHP is a server side scripting language that is embedded in HTML. It is used to manage dynamic
content, databases, session tracking, even build en tire e -commerce sites.
It is integrated with a number of popular databases, including MySQL, PostgreSQL, Oracle, Sybase,
Informix, and Microsoft SQL Server.
PHP is pleasingly zippy in its execution, especially when compiled as an Apache module on the Unix
side. The MySQL server, once started, executes even very complex queries with huge result sets in
record -setting time.
PHP supports a large number of major protocols such as POP3, IMAP, and LDAP. PHP4 added
support for Java and distributed object architect ures (COM and CORBA), making n -tier development
a possibility for the first time.
Common uses of PHP
PHP performs system functions, from files on a system it can create, open, read, write, and close
them.
PHP can handle forms, gather data from files, save data to a file, through email you can send data,
return data to the user.
 You add, delete and modify elements within your database through PHP.
 Access coo kies variables and set cookies.
 Using PHP, you can restrict users to acc ess some pages of your website .
 It can encrypt data.
Characteristics of PHP
Five important characteristics make P HP's practical nature possible :
 Simplicity
 Efficiency
 Security
 Flexibility

5
 Familiarity
"Hello World" Script in PHP
To get a feel for PHP, first start with simple PHP script s. Since "Hello, World!" is an essential
example, first we will create a friendly little "Hello, World!" script.
As mentioned earlier, PHP is embedded in HTML. That means that in amongst your normal HTML
(or XHTML if you're cutting -edge) you'll have PHP st atements like this –
<html>

<head>
<title>Hello World </title>
</head>

<body>
<?php echo "Hello, World!" ;?>
</body>

</html>
It returns the following result −
Hello, World!

If you examine the HTML output of the above example , you'll notice that the PHP code is not present
in the file sent from the server to your Web browser. All of the PHP present in the Web page is
processed and stripped from the page; the only thing returned to the client from the Web server is pure
HTML ou tput.

All PHP code must be included inside one of the three special markup tags ATE are recognised by the
PHP Parser.
<?php PHP code goes here ?>

<? PHP code goes here ?>

<script language = "php"> PHP code goes here </script>

6
1.4.2 MySQL Database
MySQL is an Oracle -backed open source relational database management system (RDBMS) based on
Structured Query Language (SQL). MySQL runs on virtually all platforms, including Linux, UNIX
and Windows. Although it can be used in a wide range of applications, MySQL is most often
associated with web applications and online publishing.
MySQL is an important component of an open source enterprise stack called LAMP. LAMP is a web
development platform that uses Linux as the operating system, Apache as the web server, MyS QL as
the relational database management system and PHP as the object -oriented scripting language.
(Sometimes Perl or Python is used instead of PHP.)
Today, MySQL is the RDBMS behind many of the top websites in the world and countless corporate
and consume r-facing web -based applications, including Facebook, Twitter and YouTube.
How MySQL works
MySQL is based on a client -server model. The core of MySQL is MySQL server, which handles all of
the database instructions (or commands). MySQL server is available as a separate program for use in
a client -server networked environment and as a library that can be embedded (or linked) into seperate
applications.
MySQL operates along with several utility programs which support the administration of MySQL
databases. Comma nds are sent to MySQLServer via the MySQL client, which is installed on a
computer.
MySQL was originally developed to handle large databases quickly. Although MySQL is typically
installed on only one machine, it is able to send the database to multiple loc ations, as users are able to
access it via different MySQL client interfaces. These interfaces send SQL statements to the server
and then display the results.
Core MySQL features
MySQL enables data to be stored and accessed across multiple storage engines, including InnoDB,
CSV, and NDB. MySQL is also capable of replicating data and partitioning tables for better
performance and durability. MySQL users aren't required to learn new commands; they can access
their data using standard SQL commands.
MySQL is wr itten in C and C++ and accessible and available across over 20 platforms, including
Mac, Windows, Linux and Unix. The RDBMS supports large databases with millions records and

7
supports many data types including signed or unsigned integers 1, 2, 3, 4, and 8 bytes long; FLOAT;
DOUBLE; CHAR; VARCHAR; BINARY; VARBINARY; TEXT; BLOB; DATE; TIME;
DATETIME; TIMESTAMP; YEAR; SET; ENUM; and OpenGIS spatial types. Fixed – and variable –
length string types are also supported.
For security, MySQL uses an access privilege a nd encrypted password system that enables host -based
verification. MySQL clients can connect to MySQL Server using several protocols, including TCP/IP
sockets on any platform. MySQL also supports a number of client and utility programs, command –
line progra ms and administration tools such as MySQL Workbench.
Compatibility with other services
MySQL was designed to be compatible with other systems. It supports deployment in virtualized
environments, such as Amazon RDS for MySQL, Amazon RDS for MariaDB and Amaz on Aurora for
MySQL. Users can transfer their data to a SQL Server database by using database migration tools like
AWS Schema Conversion Tool and the AWS Database Migration Service.

1.4.3 HTML
HTML was first created by Tim Berners -Lee, Robert Cailliau, and othe rs starting in 1989. It stands
for Hyper Text Markup Languag e.
Hypertext means that the document contains links that allow the reader to jump to other places in the
document or to another document altogether. The la test version is known as HTML5.
A Markup Language is a way that computers speak to each other to control how text is processed and
presented. To do this HTML uses t wo things: tags and attributes.
What are Tags and Attributes?
Tags and attributes are the basis of HTML.
They work together but perfo rm different functions – it is worth investing 2 minutes in differentiating
the two.

8
What Are HTML Tags?
Tags are used to mark up the start of an HTML element and they are usually enclosed in angle
brackets. An example of a tag is: <h1>.
Most tags must be opened <h1> and closed </h1> in order to function.
What are HTML Attributes?
Attributes contain additional pieces of information. Attributes take the form of an opening tag and
additional info is placed inside.
An example of an attribute is:
<img src="m ydog .jpg" alt="A photo of my dog.">
In this instance, the image source (src) and the alt text (alt) are attributes of the <img> tag.

1.4.4 CSS ( Cascading Style Sheets )
CSS stands for Cascading Style Sheets with an emphasis placed on “Style.” While HTML is used to
structure a web document (defining things like headlines and paragraphs, and allowing you to embed
images, video, and other media), CSS comes through and specifies your document’s style —page
layouts, colors, and fonts are all determined with CSS. Think of HTML as the foundation (every
house has one), and CSS as the aesthetic choices (there’s a big difference between a Victorian
mansion and a mid -century modern home).
How Does CSS Work?
CSS brings style to your web pages by interacting with HTML elements. Elements are the individual
HTML components of a web page —for instance a paragraph —which in HTML might look like this:
<p>This is my paragraph!</p>

If you wanted to make this paragraph appear pink and bold to people viewing your web page through
a web br owser, you’d use CSS code that looks like this:
p { color:pink; font-weight:bold; }

9
In this case, “p” (the paragraph) is called the “selector” —it’s the part of CSS code specifying which
HTML element the CSS styling will effect. In CSS, the selector is written to the left of the first curly
bracket. The information between curly brackets is called a declaration, and it contains properties and
values that are applied to the selector. Properties are things like font size, color, and margins, while
values are the settings for those properties. In the example above, “color” and “font -weight” are both
properties, and “pink” and “bold” are values. The full bracketed set of
{ color:pink; font-weight:bold; }

is the declaration, and again, “p” (meaning the H TML paragraph) is the selector. These same basic
principles can be applied to change font sizes, background colors, margin indentations, and more. For
instance. . .
body { background -color:lightblue; }

. . .would make your page’s background light blue, or. . .
p { font-size:20px; color:red; }

. . .will create a 20 point font paragraph with red letters.
External, Internal, or Inline CSS?
You might be wondering how this CSS code is actually applied to HTML content, though. Much like
HTML, CSS is writ ten in simple, plain text through a text editor or word processor on your computer,
and there are three main ways to add that CSS code to your HTML pages. CSS code (or Style Sheets)
can be external, internal, or inline. External style sheets are saved as . css files and can be used to
determine the appearance of an entire website through one file (rather than adding individual
instances of CSS code to every HTML element you want to adjust). In order to use an external style
sheet, your .html files need to in clude a header section that links to the external style sheet and looks
something like this:
<head>
<link rel=”stylesheet” type=”text/css” href=mysitestyle.css”>
</head>

10
This will link the .html file to your external style sheet (in this case, mysitesty le.css), and all of the
CSS instructions in that file will then apply to your linked .html pages.

Internal style sheets are CSS instructions written directly into the header of a specific .html page.
(This is especially useful if you have a single page on a site that has a unique look.) An internal style
sheet looks something like this. . .
<head>
<style>
Body { background -color:thistle; }
P { font-size:20px; color:mediumblue; }
</style>
</head>

. . . a background color and paragraphs with 20 point , medium blue font will now be applied to this
single .html page.

Finally, inline styles are snippets of CSS written directly into HTML code, and applicable only to a
single coding instance. For example:
<h1 style=”font -size:40px;color:violet;”>Check out this headline!</h1>

Would cause one specific headline on a single .html page to appear in violet, 40 point font.
Generally speaking, external style sheets are the most efficient method for implementing CSS on a
website (it’s easier to keep track of and i mplement a site’s style from a dedicated CSS file), while
internal style sheets and inline style can be used on a case by case basis when individual style changes
need to be made.
So if HTML is the foundation, frames, walls, and girders supporting your web site, consider CSS the
paint color, window styles, and landscaping that comes on afterward. You can’t get anywhere without
putting that foundation up first, but —once you do —you’ll want to follow up with some style, and
CSS is the ticket to unleashing your inner decorator.

11
1.4.5 JavaScript
JavaScript was initially created to “make web pages alive”.
The programs in this language are called scripts. They can be written right in a web page’s HTML and
run automatically as the page loads.
Scripts are provided and exe cuted as plain text. They don’t need special preparation or compilation to
run.
In this aspect, JavaScript is very different from another language called Java.

Why JavaScript?
When JavaScript was created, it initially had another name: “LiveScript”. But J ava was very popular
at that time, so it was decided that positioning a new language as a “younger brother” of Java would
help.
But as it evolved, JavaScript became a fully independent language with its own specification called
ECMAScript, and now it has n o relation to Java at all.
Today, JavaScript can execute not only in the browser, but also on the server, or actually on any
device that has a special program called the JavaScript engine.
The browser has an embedded engine sometimes called a “JavaScript v irtual machine”.
Different engines have different “codenames”. For example:
V8 – in Chrome and Opera.
SpiderMonkey – in Firefox. There are other codenames like “Trident” and “Chakra” for different
versions of IE, “ChakraCore” for Microsoft Edge, “Nitro” an d “SquirrelFish” for Safari, etc.
The terms above are good to remember because they are used in developer articles on the internet.
We’ll use them too. For instance, if “a feature X is supported by V8”, then it prob ably works in
Chrome and Opera.
How do en gines work?
Engines are complicated. But the basics are easy.
The engine (embedded if it’s a browser) reads (“parses”) the script.

12
Then it converts (“compiles”) the script to the machine language.
And then the machine code runs, pretty fast.
The engine app lies optimizations at each step of the process. It even watches the compiled script as it
runs, analyzes the data that flows through it, and applies optimizations to the machine code based on
that knowledge. When it’ s done, scripts run quite fast.
What can in-browser JavaScript do?
Modern JavaScript is a “safe” programming language. It does not provide low -level access to memory
or CPU, because it was initially created for browsers which do not require it.
JavaScript’s capabilities greatly depend on the env ironment it’s running in. For instance, Node.js
supports functions that allow JavaScript to read/write arbitrary files, perform network requests, etc.
In-browser JavaScript can do everything related to webpage manipulation, interaction with the user,
and t he webserver.
For instance, in -browser JavaScript is able to:
 Add new HTML to the page, change the existing content, modify styles.
 React to user actions, run on mouse clicks, pointer movements, key presses.
 Send requests over the network to remote servers , download and upload files (so -called
AJAX and COMET technologies).
 Get and set cookies, ask questions to the visitor, show messages.
 Remember the data on the client -side (“local storage”).
What CAN’T in -browser JavaScript do?
JavaScript’s abilities in th e browser are limited for the sake of the user’s safety. The aim is to prevent
an evil webpage from accessing private informat ion or harming the user’s data.
Examples of such restrictions include:
JavaScript on a webpage may not read/write arbitrary files on the hard disk, copy them or execute
programs. It has no direct access to OS system functions.
Modern browsers allow it to work with files, but the access is limited and only provided if the user
does certain actions, like “dropping” a file into a browse r window or selecting it via an <input> tag.
There are ways to interact with camera/microphone and other devices, but they require a user’s
explicit permission. So a JavaScript -enabled page may not sneakily enable a web -camera, observe the
surroundings and send the information to the NSA.

13
Different tabs/windows generally do not know about each other. Sometimes they do, for example
when one window uses JavaScript to open the other one. But even in this case, JavaScript from one
page may not access the other if they come from different sites (from a different domain, protocol or
port).
This is called the “Same Origin Policy”. To work around that, both pages must agree for data
exchange and contain a special JavaScript code that handles it. We’ll cover that in the tutorial.
This limitation is, again, for the user’s safety. A page from http://anysite.com which a user has opened
must not be able to access another browser tab with the URL http://gmail.com and steal information
from there.
JavaScript can easily comm unicate over the net to the server where the current page came from. But
its ability to receive data from other sites/domains is crippled. Though possible, it requires explicit
agreement (expressed in HTTP headers) from the remote side. Once again, that’s a safety limitation.

Figure 1 JavaScript In Browser

What makes JavaScript unique?
There are at least three great things about JavaScript:
 Full integration with HTML/CSS.
 Simple things are done simply.
 Support by all major brow sers and enabled by default.
JavaScript is the only browser technology that combines these three things.

14
That’s what makes JavaScript unique. That’s why it’s the most widespread tool for creating browser
interfaces.
That said, JavaScript also allows to cre ate servers, mobile applications, etc.
Languages “over” JavaScript
The syntax of JavaScript does not suit everyone’s needs. Different people want different features.
That’s to be expected, because projects and requirements are different for everyone.
So re cently a plethora of new languages appeared, which are transpiled (converted) to JavaScript
before they run in the browser.
Modern tools make the transpilation very fast and transparent, actually allowing developers to code in
another language and auto -converting it “under the hood”.
Examples of such languages:
CoffeeScript is a “syntactic sugar” for JavaScript. It introduces shorter syntax, allowing us to write
clearer and more precise code. Usually, Ruby devs like it.
TypeScript is concentrated on adding “strict data typing” to simplify the development and support of
complex systems. It is developed by Microsoft.
Flow also adds data typing, but in a different way. Developed by Facebook.
Dart is a standalone language that has its own engine that runs in non -browser environments (like
mobile apps), but also can be transpiled to JavaScript. Developed by Google.
There are more. Of course, even if we use one of transpiled languages, we should also know
JavaScript to really understand what we’re doing.

1.4.6 jQuery

jQuery is a fast and concise JavaScript Library created by John Resig in 2006 with a nice
motto: Write less, do more . jQuery simplifies HTML document traversing, event handling,
animating, and Ajax interactions for rapid web development. jQuery is a JavaScr ipt toolkit designed
to simplify various tasks by writing less code. Here is the list of important core features supported by
jQuery −
 DOM manipulation − The jQuery made it easy to select DOM elements, negotiate them and
modifying their content by using cr oss-browser open source selector engine called Sizzle .
 Event handling − The jQuery offers an elegant way to capture a wide variety of events, such
as a user clicking on a link, without the need to clutter the HTML code itself with event
handlers.
 AJAX Supp ort − The jQuery helps you a lot to develop a responsive and featurerich site
using AJAX technology.
 Animations − The jQuery comes with plenty of built -in animation effects which you can use
in your websites.

15
 Lightweight − The jQuery is very lightweight li brary – about 19KB in size (Minified and
gzipped).
 Cross Browser Support − The jQuery has cross -browser support, and works well in IE 6.0+,
FF 2.0+, Safari 3.0+, Chrome and Opera 9.0+
 Latest Technology − The jQuery supports CSS3 selectors and basic XPath s yntax.

How to use jQuery?
 Local Installation − You can download jQuery library on your local machine and include it
in your HTML code.
 CDN Based Version − You can include jQuery library into your HTML code directly from
Content Delivery Network (CDN).
Local Instalation
 In order to install jQuery on the local computer, the user have to access the following link
https://jquery.com/download/ in order to download the latest version available.
 After down loading the .js file the user has to move the .js file in the website directoy
Now the user can include jquery library in the HTML file as follows −
<html>
<head>
<title>The jQuery Example </title>
<script type = "text/javascript" src = "/jquery/jquery –
2.1.3.min.js" >
</script>

<script type = "text/javascript" >
$(document ).ready(function () {
document .write("Hello, World!" );
});
</script>
</head>

<body>
<h1>Hello</h1>
</body>
</html>
This will produce following result –
Hello, World!

16
1.5 Application architecture
The application uses MVC (Model View Co ntroller) as the programming style. MVC is a model
/ type of architecture used in software engineering. It is used very often in production, this being
somewhat the standard for web programming but also standalone. The most popular PHP frameworks
(Symfony, Laravel, Zend, PHP Cake etc.).
This type of code approach enjoys this success due to the isolation of the main logic (database
interactio n, more complex operations) from the user interface, and the data from it is processed to
another level. So each of t hese three levels has a well established role. Generally, the view takes the
user information and sends it to the controller. It delivers it to the model, which processes it and
resubmits to the controller the final processed information. The latter delive rs it to the viewer / user.
This logic separates by level, the controller being the one delivering in the two parts while the model
never communicates with the view.
The following figures will illustrate the composition of the root / main directory and rel ated
subdirectories.

Figure 2. The root component

17
Bootstrap is a web framework that focuses on simplifying the development of informative
web pages (as opposed to web apps). The primary purpose of adding it to a web project is t o
apply Bootstrap's choices of color, size, font and layout to that project. As such, the primary
factor is whether the developers in charge find those choices to their liking. Once added to a
project, Bootstrap provides basic style definitions for all HTM L elements. The end is a
uniform appearance for prose, tables and form elements across web browsers. In addition,
developers can take advantage of CSS classes defined in Bootstrap to further customize the
appearance of their contents. For example, Bootstra p has provisioned for light – and dark –
colored tables, page headings, more prominent pull quotes, and text with a highlight.

Bootstrap also comes with several JavaScript components in the form of jQuery plugins.
They provide additional user interface eleme nts such as dialog boxes, tooltips, and carousels.
Each Bootstrap component consists of an HTML structure, CSS declarations, and in some
cases accompanying JavaScript code. They also extend the functionality of some existing
interface elements, including f or example an auto -complete function for input fields.

Example of a webpage using Bootstrap framework
Example of a webpage using Bootstrap framework rendered in Firefox
The most prominent components of Bootstrap are its layout components, as they affect
an entire web page. The basic layout component is called "Container", as every other element
in the page is placed in it. Developers can choose between a fixed -width container and a
fluid-width container. While the latter always fills the width of the web p age, the former uses
one of the four predefined fixed widths, depending on the size of the screen showing the
page:
 Smaller than 576 pixels
 576–768 pixels
 768–992 pixels
 992–1200 pixels
 Larger than 1200 pixels
Once a container is in place, other Bootstrap layout components implement a CSS grid
layout through defining rows and columns.

A precompiled version of Bootstrap is available in the form of one CSS file and three
JavaScript files that can be readily added to any project. The raw form of Bootstrap, ho wever,

18
enables developers to implement further customization and size optimizations. This raw form
is modular, meaning that the developer can remove unneeded components, apply a theme and
modify the uncompiled Sass files.

Figure 3. Assets directory
In the hms directory, you find the entire code for this application. It is divided into several
subfolders, each of which has a certain importance in the economy of the entire application (Figure 3).

19

Figure 4. Application directory

The directories that interested me in writing the application are: admin, doctor, and include. As
mentioned above, the architecture / design pattern of the application is MVC. But, like all MVCs, this
is also a custom one. Custom in the idea that the relationship between the three components is not 1:
1: 1. I decided not to go on the idea of 1: 1: 1 because the application is quite small and because much
logic used on back -end is applied on the front end and vice versa.

20

Figure 5. admin directory

21
2 WEB APPLICATION – INTERFACE PRESENTATI ON
În this section I will present the interface of each page and its sections as well as their
functionalities.

2.1 Home Page

Figure 6. Home Page
When first accessing the websi te via any link, if the user has not previously logged in, he/she
will be prompted to the home page.
From this page the user can make several actions. He/ she can click on the „Contact” button, or, the
user can login or register an account.
The web applic ation has three diferent types of users.
The Admin user, this user can add docto rs specialityes, add doctors to the webb application, can
manage doctors, appoiments, pacients. He/she can view the doctors and patiens session logs, and the
history of the app oiments.

22
The type of users Doctors can login with an existing account.
And the users patients that can login with an existing account or they can regi ster and create a new
account.
2.1.1 Register
If the user “Patients” does not have an account, he/she can clic k on the register button “ Register
& Book Appointment ” and will be redirected to the following screen .

Figure 7. Register page
At the “Patient registration ” screen, the user has to ins ert a first name, last name, a valid
address , the current City, the G ender (Male or Female), a valid email address, a password, the
reconfirm the password, and also the user has to check a checkbox that he/she give us the permission

23
to create the account. Then the user has to click on the button “Submit”. After submitting t he
registration formular, the user can observe a pop up window browser with the following message
“Successfully Registered. You can login now ”. And the user will be redirected to the Login screen.

Figure 8. Login Screen

24
2.1.2 Login Screen for all ti pes of users.
This web application was developed in order to facilitate the doctor’s appoiments.
The type of users, “Doctors” cannot create an account by themselves. The Admin user has the role to
add an account for the doctor. After the admin user crates the account for the user type doctor. The
doctor can login in the application.

Figure 9. Doctors Login Screen
Here, the user type doctor asked to insert the username used when the account was created
and the password that was given in order to login.
After the Login the user is redirected to the Doctor/ Dasboard

Figure 10. Doctor Dashbord
After the user insets the email address he/she will be redirect to the login page and a
notification will appear on screen saying that the email with instructions to reset the password has
been sent .

25
The Admin type user can login into the web application with an username and password, that
was given when the application was developed.

Figure 11. Admin Login screen
After the Admin user completes the required fields with the username and password, he will
be redirected to the Admin Dashboard screen.

Figure 12. Admin Dashboard screen

26
2.1.3 Log out
The log out button is included in the menu which appears on every page so the user can log out
at any given time by click ing it and then be redirected to the login screen.

Figure 13. Log out

27
2.1.4 Change Password
The “Change Password” button is included in the menu which appears on every page so the
user can change is password when he/she wants at any given time b y clicking it and then the user will
be redirected to the change password screen.
Figure 14 . Change Password

On the “Change Password” screen the user have to write the old password, the new password
and the reconfirm the new password. After the fields are completed the user have to click the
“Submit” button .

2.2 The Dashboard Page
After a successful login, the user will be redirected to the dasboard page. The Dasboard page is
differnet for the user accouns.
From the Dasboard page the different types of us ers can make different operations such as,
book an appoiment.
Update the user profile, cancel or approve an appoiment etc.. Since the dashboard page has
different functionalityes for all three users types, we will describe each dashboard page for each type
of users in the next chapters.

28

Figure 15. Main page: Dashboard page

2.2.1 Dasboard Page functionalityes for the Admin user
The Admin Dashboard is the more complex, because the Admin user is the mos empowered user that
has all the permisions, to add, delete , approwe and cancel all the actions from the web application.
This is how the Admin Dashboard looks, and now we will describe each action that the Admin user
can make in the web application.

Figure 16. Dashboard page – admin user
In the left menu we can observe 6 menu Items: “Dasboard”, “Doctors” drop down list, “Patients” –
drop down list,” Appoiment History”, “Doctors session logs” and “User session logs”.

29

Figure 17 Left Menu – Admin
The “Doctors” menu item – is a drop down list that has three sub -pages: “Doctor Specialization”,
“Add Doctors” and “Manage Doctors”.

Figure 18 – Doctors drop down list
If the Admin users clicks on the “Doctor Specialization” menu Item, it will be redirected to the Doctor
specialization Screen. From this screen the Admi n can add a new doctor specialization, update an
existing doctor specialization or delete/remove an existing one.

30

Figure 19 – Doctor Specialization
Add doctors – menu item. If the Admin user click on the add doctors menu item it will be redirected
to the Add a doctor screen. From here the Admin user can Add a doctor, link the added doctor to a n
existing specialization , add doctorsfirst and last name, contact information, doctors email and set up a
password for the new added user account.

Figure 20 – Add a doctor

31
From the Manage Doctors menu item the admin user can, update the existing user accounts, or it can
delete existing user accounts.

Figure 21 – Manage Doctors
From the “Manage Patiens” menu item the Admin user can vew all the existing patients that have
registered on the web application, and the admin user can remove/ delete the existing accounts.

Figure 22 – Manage Patients

32
2.2.2 Dasboard Page Functionality -Doctor user
This is how the Doctors Dashboard looks, and now we will describe each action that the Doctors user
can make in the web application.

Figure 23 – Doctors Dashboard
The doctor user can click on the Appoiment History and a list of the appoiments it will be displayed.
Here the doctor can cancel an active appoiment.

Figure 24 – Appoiment History

33
2.2.3 Dashboard Page Functionality – Patient user
After the Patient user is logged in, the user can see the Dasboard screen. From here the patient user
can book an appoiment, select a doctor specialization, select an avalabile doctor, s elect a date and a
hour. Also the patient user can see the cost of the consultation.

Figure 25 – Patient Dashboard

3 WEB APPLICATION – IMPLEMENTATION
In this section I will present how each page was implemented and explain the functionalities
alongside im portant snippets of code.

3.1 The database
The database is administrated through phpMyAdmin which is a database management system
installed in the XAMPP environment. This system allows us to create and run a web application that
uses PHP and MySQL. The data base has the following tables:

34

Figure 26. The database

Figure 27 – Database Design

35
Following is a list of the tables in the database alongside a description of each one:
Table name Description
Admin This table has the username and password
informatio n for the admin user

appointment In this table we stored all the appoiments made
from the patient user.

doctors The table where we store doctor information such
as: doctor specialization, fees, doctors id, name,
username and password

doctorslog The t able where we manage the logs from the
doctors login activity, it show us the ip, the status
of the login and the date and hour.

doctorspecialization The table where we store doctor specialization
information.

users The table where we store patients i nformation
such as: first name, last name, email, password,
user id, address

userlog The table where we manage the logs from the
patients login activity, it show us the ip, the
status of the login and the date and hour.

Table 1. The database

36
3.2 Login page
As stated at in the 2.1 section of this paper, every user must first login before gaining access to
the web application.
When the user inputs data in both the email form and the password form and it is validated, the
form wil l close and the user wi ll be redirected to the „Dashboard ” page (the main page). The login
page php code for the two forms (email and password) from the user-login .php file is:

<body class="login" >
<div class="row">
<div class="main-login col -xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2
col-md-4 col-md-offset-4">
<div class="logo margin -top-30">
<h2> HMS | Patient Login </h2>
</div>

<div class="box-login">
<form class="form-login" method="post">
<fieldset>
<legend>
Sign in to your account
</legend>
<p>
Please enter your name and password to log in. <br />
<span style="color:red;"><?php echo $_SESSION ['errmsg' ];
?><?php echo $_SESSION ['errmsg' ]="";?></span>
</p>
<div class="form-group">
<span class="input-icon">
<input type="text" class="form-control" name="username"
placeholder ="Username" >
<i class="fa fa-user"></i> </span>
</div>
<div class="form-group form -actions" >
<span class="input-icon">
<input type="password" class="form-control password"
name="password" placeholder ="Password" >
<i class="fa fa-lock"></i>
</span>
</div>
<div class="form-actions" >

<button type="submit" class="btn btn -primary pull -right"
name="submit" >
Login <i class="fa fa-arrow-circle-right"></i>
</button>
</div>
<div class="new-account" >
Don't have an account yet?
<a href="registration.php" >
Create an account
</a>
</div>

37
</fieldset>
</form>

<div class="copyright" >
&copy; <span class="current -year"></span><span class="text-bold
text-uppercase" > HMS</span>. <span>All rights reserved </span>
</div>

</div>

</div>
</div>

The session and vali dation rules are in the user-login .php file:

<?php
session_start() ;
error_reporting( 0);
include("include/config.php" );
if(isset($_POST['submit' ]))
{
$ret=mysql_query( "SELECT * FROM users WHERE email='" .$_POST['username' ]."' and
password= '".md5($_POST['password' ])."'");
$num=mysql_fetch_array( $ret);
if($num>0)
{
$extra="dashboard.php" ;//
$_SESSION ['login']=$_POST['username' ];
$_SESSION ['id']=$num['id'];
$host=$_SERVER ['HTTP_HOST' ];
$uip=$_SERVER ['REMOTE_ADDR' ];
$status=1;
$log=mysql_query( "insert into userlog(uid,username,userip,status)
values('" .$_SESSION ['id']."','".$_SESSION ['login']."','$uip','$status')");
$uri=rtrim(dirname( $_SERVER ['PHP_SELF' ]),'/\\');
header("location:http:// $host$uri /$extra");
exit();
}
else
{
$_SESSION ['login']=$_POST['username' ];
$uip=$_SERVER ['REMOTE_ADDR' ];
$status=0;
mysql_query( "insert into userlog(username,userip,status)
values('" .$_SESSION ['login']."','$uip','$status')");
$_SESSION ['errmsg' ]="Invalid username or password" ;
$extra="user-login.php" ;
$host = $_SERVER['HTTP_HOST' ];
$uri = rtrim(dirname( $_SERVER ['PHP_SELF' ]),'/\\');
header("location:http:// $host$uri /$extra");
exit();
}
}
?>

38
The check login is located in the check -login.php and the code that verify the session id is:
<?php
function check_login ()
{
if(strlen( $_SESSION ['login'])==0)
{
$host = $_SERVER ['HTTP_HOST' ];
$uri = rtrim(dirname( $_SERVER ['PHP_SELF' ]), '/\\');
$extra="../admin.php" ;
$_SESSION ["login"]="";
header("Location: http:// $host$uri /$extra");
}
}
?>

3.2.1 Register
At the login page, the registration link is right under the sign in form and the php code is in
the registration .php file:
</head>

<body class="login" >
<!– start: REGISTRATION –>
<div class="row">
<div class="main-login col -xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2
col-md-4 col-md-offset-4">
<div class="logo margin -top-30">
<h2>Patient Registration </h2>
</div>
<!– start: REGISTER BOX –>
<div class="box-register" >
<form name="registration" id="registration" method="post">
<fieldset>
<legend>
Sign Up
</legend>
<p>
Enter your personal details below:
</p>
<div class="form-group">
<input type="text" class="form-control" name="full_name"
placeholder ="Full Name" required >
</div>
<div class="form-group">
<input type="text" class="form-control" name="address"
placeholder ="Address" required >
</div>
<div class="form-group">
<input type="text" class="form-control" name="city"
placeholder ="City" required>
</div>
<div class="form-group">

39
<label class="block" >
Gender
</label>
<div class="clip-radio radio -primary" >
<input type="radio" id="rg-female" name="gender"
value="female" >
<label for="rg-female">
Female
</label>
<input type="radio" id="rg-male" name="gender"
value="male">
<label for="rg-male">
Male
</label>
</div>
</div>
<p>
Enter your account details below:
</p>
<div class="form-group">
<span class="input-icon">
<input type="email" class="form-control" name="email"
id="email" onBlur="userAvailability ()" placeholder ="Email" required>
<i class="fa fa-envelope" ></i> </span>
<span id="user-availability -status1" style="font-
size:12px;"></span>
</div>
<div class="form-group">
<span class="input-icon">
<input type="password" class="form-control" id="password"
name="password" placeholder ="Password" required >
<i class="fa fa-lock"></i> </span>
</div>
<div class="form-group">
<span class="input-icon">
<input type="password" class="form-control"
name="password_again" placeholder ="Password Again" required >
<i class="fa fa-lock"></i> </span >
</div>
<div class="form-group">
<div class="checkbox clip -check check -primary" >
<input type="checkbox" id="agree" value="agree" >
<label for="agree" >
I agree
</label>
</div>
</div>
<div class="form-actions" >
<p>
Already have an account?
<a href="user-login.php" >
Log-in
</a>
</p>
<button type="submit" class="btn btn -primary pull -right"
id="submit" name="submit" >
Submit <i class="fa fa-arrow-circle-right"></i>

40
</button>
</div>
</fieldset>
</form>

<div class="copyright" >
&copy; <span class="current -year"></span><span class="text-bold
text-uppercase" > HMS</span>. <span>All rights reserved </span>
</div>

</div>

</div>
</div>
The block of code from above saves the user data and closes the form after the user clicks the
submit button (“ Submit ”) and the n, in the registration. php file the data validation occurs:
<?php
include_once ('include/config.php' );
if(isset($_POST['submit' ]))
{
$fname=$_POST['full_name' ];
$address =$_POST['address' ];
$city=$_POST['city'];
$gender=$_POST['gender' ];
$email=$_POST['email'];
$password =md5($_POST['password' ]);
$query=mysql_query( "insert into users(fullname,address,city,gender,email,password)
values(' $fname','$address ','$city','$gender','$email','$password ')");
if($query)
{
echo "<script> alert('Successfully Registered. Yo u can login now');</script>" ;
//header('location:user -login.php');
}
}
?>

3.2.2 Log out
The log out button is included in the menu so it will be present on every page and the php code
is in the logout .php:
<?php
session_start() ;
include('include/config.php' );
$_SESSION ['login']=="";
date_default_timezone_set( 'Asia/Kolkata' );
$ldate=date( 'd-m-Y h:i:s A' , time () ) ;
mysql_query( "UPDATE userlog SET logout = ' $ldate' WHERE uid =
'".$_SESSION ['id']."' ORDER BY id DESC LIMIT 1" );
session_unset() ;
//session_destr oy();

41
$_SESSION ['errmsg' ]="You have successfully logout" ;
?>
<script language ="javascript" >
document .location ="./user-login.php" ;
</script>

3.3 Change Password
The Change password functionaliy is applicable to any type of user. The buuton Change password is
located befor the Logout button.
<div class="main-content" >
<div class="wrap-content container" id="container" >
<!– start: PAGE TITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >User | Change Password </h1>
</div>
<ol class="breadcrumb" >
<li>
<span>User</span>
</li>
<li class="active" >
<span>Change Password </span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">
<div class="row">
<div class="col-md-12">

<div class="row margin -top-30">
<div class="col-lg-8 col-md-12">
<div class="panel pane l-white">
<div class="panel-heading" >
<h5 class="panel-title">Change
Password </h5>
</div>
<div class="panel-body">
<p style="color:red;"><?php echo
htmlentities( $_SESSION ['msg1']);?>
<?php echo htmlentities( $_SESSION ['msg1']="");?></p>
<form role="form" name="chngpwd"
method="post" onSubmit ="return valid();">
<div class="form-group">
<label for="exampleInputEmail1" >
Current Password
</label>
<input type="password" name="cpass" class="form-control"
placeholder ="Enter Current Password" >

42
</div>
<div class="form-group">
<label for="exampleInputPassword1" >
New Password
</label>
<input type="password" name="npass" class="form-control"
placeholder ="New Password" >
</div>

<div class="form-group">
<label for="exampleInputPassword 1">
Confirm Password
</label>
<input type="password" name="cfpass" class="form-
control" placeholder ="Confirm Password" >
</div>

<button type="submit" name="submit"
class="btn btn -o btn-primary" >
Submit
</button>
</form>
</div>
</div>
</div>
The block of code from above saves the user data and closes the form after the user clicks the
submit button (“Submit”) and then, in the change -password.php file the data validation occurs:
<?php
session_start() ;
//error_repo rting(0);
include('include/config.php' );
include('include/checklogin.php' );
check_login() ;
date_default_timezone_set( 'Asia/Kolkata' );// change according timezone
$currentTime = date( 'd-m-Y h:i:s A' , time () ) ;
if(isset($_POST['submit' ]))
{
$sql=mysql_quer y("SELECT password FROM users where
password='" .md5($_POST['cpass'])."' && email='" .$_SESSION ['login']."'");
$num=mysql_fetch_array( $sql);
if($num>0)
{
$con=mysql_query( "update users set password='" .md5($_POST['npass'])."',
updationDate=' $currentTime ' where email='" .$_SESSION ['login']."'");
$_SESSION ['msg1']="Password Changed Successfully !!" ;
}
else
{
$_SESSION ['msg1']="Old Password not match !!" ;
}
}
?>

43
3.4 The Dashboard Page – Fuctionalities for the patient user
The main page also known as “ Dashboard ” page is the page that users get redirected after login
and the main page that user will use in the web application:
<body>
<div id="app">
<?php include ('include/sidebar.php' );?>
<div class="app-content" >

<?php include ('include/header.php' );?>

<!– end: TOP NAVBAR –>
<div class="main-content" >
<div class="wrap-content container" id="container" >
<!– start: PAGE TITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >User | Dashboard </h1>
</div>
<ol class="breadcrumb" >
<li>
<span>User</span>
</li>
<li class="active" >
<span>Dashboard </span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">
<div class="row">
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa -stack-2x text-primary" ></i> <i class="fa fa-smile-o fa-stack-1x fa-
inverse" ></i> </span>
<h2 class="StepTitle" >My Profile </h2>

<p class="links cl -effect-1">
<a href="edit-profile.php" >
Update Profile
</a>
</p>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa -stack-2x text-primary" ></i> <i class="fa fa-paperclip fa -stack-1x fa-

44
inverse" ></i> </span>
<h2 class="StepTitle" >My Appointments </h2>

<p class="cl-effect-1">
<a href="appointment -history.php" >
View Appointment History
</a>
</p>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa -stack-2x text-primary" ></i> <i class="fa fa-terminal fa -stack-1x fa-
inverse" ></i> </span>
<h2 class="StepTitle" > Book My Appointment </h2>

<p class="links cl -effect-1">
<a href="book-appointment.php" >
Book Appointment
</a>
</p>
</div>
</div>
</div>
</div>
</div>
3.4.1 Book an appointment
After the pacient user is logged in the web application, the user can book an appointment to a doctor.
The code that verify and fetch data from the database in o rder to can make an appointment is:
<?php
session_start() ;
//error_reporting(0);
include('include/config.php' );
include('include/checklogin.php' );
check_login() ;

if(isset($_POST['submit' ]))
{

$specilization =$_POST['Doctorspecialization' ];
$doctorid =$_POST['doctor' ];
$userid=$_SESSION ['id'];
$fees=$_POST['fees'];
$appdate =$_POST['appdate' ];
$time=$_POST['apptime' ];
$userstatus =1;
$docstatus =1;

$query=mysql_query( "insert into

45
appointment(doctorSpecialization,doctorId,userId,consultancyFees,appointmentDa te,a
ppointmentTime,userStatus,doctorStatus)
values(' $specilization ','$doctorid ','$userid','$fees','$appdate ','$time','$usersta
tus','$docstatus ')");
if($query)
{
echo "<script> alert('Your appointment successfully booked');</script>" ;
}

}
?>

The form that the user will be able to complete in order to make an online appointment it is also
located in the book -appointment.php file:
</head>
<body>
<div id="app">
<?php include ('include/sidebar.php' );?>
<div class="app-content">

<?php include ('include/header.php' );?>

<!– end: TOP NAVBAR –>
<div class="main-content" >
<div class="wrap-content container" id="container" >
<!– start: PAGE TITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >User | Book Appointment </h1>
</div>
<ol class="breadcrumb" >
<li>
<span>User</span>
</li>
<li class="active" >
<span>Book Appointment </span>
</li>
</ol>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">
<div class="row">
<div class="col-md-12">

<div class="row margin -top-30">
<div class="col-lg-8 col-md-12">
<div class="panel panel -white">
<div class="panel-heading" >
<h5 class="panel-title">Book
Appointment </h5>
</div>
<div class="panel-body">

46
<p style="color:red;"><?php echo
htmlentities( $_SESSION ['msg1']);?>
<?php echo htmlentities( $_SESSION ['msg1']="");?></p>
<form role="form" name="book" method="post"
>

<div class="form-group">
<label for="DoctorSpecialization" >
Doctor Specialization
</label>
<select name="Doctorspecialization" class="form-control"
onChange ="getdoctor (this.value);" required ="required" >
<option value="">Select
Specialization </option>
<?php $ret=mysql_query( "select * from doctorspecilization" );
while($row=mysql_fetch_array( $ret))
{
?>
<option value="<?php echo
htmlentities( $row['specilization' ]);?>">
<?php echo
htmlentities( $row['specilization' ]);?>
</option>
<?php } ?>

</select>
</div>

<div class="form-group">
<label for="doctor" >
Doctors
</label>
<select name="doctor" class="form-control" id="doctor"
onChange ="getfee(this.value);" required="required" >
<option value="">Select Doctor </option>
</select>
</div>

<div class="form-group">
<label for="consultancyfees" >
Consultancy Fees
</label>
<select name="fees" class="form-control" id="fees" readonly >

</select>
</div>

<div class="form-group">

47
<label for="AppointmentDate" >
Date
</label>
<input class="form-control datepicker" name="appdate"
type="date" required ="required" >
</div>

<div class="form-group">
<label for="Appointmenttime" >

Time

</label>
<input class="form-control datepicker" name="apptime"
type="time" required ="required" >
</div>

<button type="submit" name="submit"
class="btn btn -o btn-primary" >
Submit
</button>
</form>
</div>
</div>
</div>

</div>
</div>

</div>
</div>

3.4.2 Edit Profile
The edit profile section is placed near the Logout button, in the upper left corner on the
Dashboard page and has the following c ode:
The categories are stored in the categories table:
<?php
session_start() ;
//error_reporting(0);
include('include/config.php' );
include('include/checklogin.php' );
check_login() ;
if(isset($_POST['submit' ]))
{
$fname=$_POST['fname'];
$address =$_POST['address' ];
$city=$_POST['city'];
$gender=$_POST['gender' ];

$sql=mysql_query( "Update users set
fullName=' $fname',address=' $address ',city=' $city',gender=' $gender' where

48
email='" .$_SESSION ['login']."'");
if($sql)
{
echo "<script> alert('Your Profile updated S uccessfully');</script>" ;

}
}
?>
3.4.3 The get doctor
The if a patient wants to make an appoiment, the user will have to choose from a list
of doctors alavabile, in this case the get_doctor.php file is used. This file fetch data from the
database with the alava bile doctors and has the following code:
<?php
include('include/config.php' );
if(!empty($_POST["specilizationid" ]))
{

$sql=mysql_query( "select doctorName,id from doctors where
specilization='" .$_POST['specilizationid' ]."'");?>
<option selected ="selecte d">Select Doctor </option>
<?php
while($row=mysql_fetch_array( $sql))
{?>
<option value="<?php echo htmlentities( $row['id']); ?>"><?php echo
htmlentities( $row['doctorName' ]); ?></option>
<?php
}
}

if(!empty($_POST["doctor" ]))
{

$sql=mysql_quer y("select docFees from doctors where id='" .$_POST['doctor' ]."'");
while($row=mysql_fetch_array( $sql))
{?>
<option value="<?php echo htmlentities( $row['docFees' ]); ?>"><?php echo
htmlentities( $row['docFees' ]); ?></option>
<?php
}
}

?>

3.4.4 Get Fees

<?php $mysql_hostname = "localhost" ;
$mysql_user = "root";
$mysql_password = "";

49
$mysql_database = "hms";
$bd = mysql_connect( $mysql_hostname , $mysql_user , $mysql_password ) or die("Could
not connect database" );
mysql_select_db( $mysql_database , $bd) or die("Could not select database" );
if($_GET['action' ]=='doctorid' ){
$docinfo =$_POST['docinfo' ];
$query= mysql_query( "select * from doctors where doctorName= $docinfo ");
$array=mysql_fetch_array( $query);
echo $array['docFees' ];

}
?>

3.5 The Dashb oard Page – Fuctionalities for the Admin user
In this section we will describe each php file functionalities for the Dashboard when logged in with
the admin user .
Since the Admin user has access to all features of this web application, the main functional ities are
listed here.
The Dashboard Page – for the admin user has the following code:
<?php include ('include/sidebar.php' );?>
<div class="app-content" >

<?php include ('include/header.php' );?>

<!– end: TOP NAVBAR –>
<div class="main-content" >
<div class="wrap-content container" id="container" >
<!– start: PAGE TITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >Admin | Dashboard </h1>
</div>
<ol class="breadcrumb" >
<li>
<span>Admin</span>
</li>
<li class="active" >
<span>Dashboard </span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">

50
<div class="row">
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa -stack-2x text-primary" ></i> <i class="fa fa-smile-o fa-stack-1x fa-
inverse" ></i> </span>
<h2 class="StepTitle" >Manage Patients </h2>

<p class="links cl -effect-1">
<a href="manage -users.php" >
<?php $result = mysql_query( "SELECT * FROM
users ");
$num_rows = mysql_num_rows( $result);
{
?>
Total Patients : <?php echo
htmlentities( $num_rows ); } ?>
</a>
</p>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa-stack-2x text-primary" ></i> <i class="fa fa-users fa -stack-1x fa-
inverse" ></i> </span>
<h2 class="StepTitle" >Manage Doctors </h2>

<p class="cl-effect-1">
<a href="manage -doctors.php" >
<?php $result1 = mysql_query( "SELECT * FROM
doctors " );
$num_rows1 = mysql_num_rows( $result1 );
{
?>
Total Doctors : <?php echo
htmlentities( $num_rows1 ); } ?>
</a>

</p>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa -stack-2x text-primary" ></i> <i class="fa fa-terminal fa -stack-1x fa-
inverse" ></i> </span>
<h2 class="StepTitle" > Appointments </h2>

<p class="links cl -effect-1">
<a href="book-appointment.php" >
<a href="appointment -history.php" >

51
<?php $sql= mysql_query( "SELECT * FROM
appointment" );
$num_rows2 = mysql_num_rows( $sql);
{
?>
Total Appointments : <?php echo
htmlentities( $num_rows2 ); } ?>
</a>
</a>
</p>
</div>
</div>
</div>
</div>
</div>

3.5.1 Add Doctor
The Admin user can add a doctor into the web application. Ths operation is m ade from the add –
doctor.php file. The Admin user has to complete a add a doctor form in order to complete all the
necessary fields. The form has the following code:
</head>
<body>
<div id="app">
<?php include ('include/sidebar.php' );?>
<div class="app-content" >

<?php include ('include/header.php' );?>

<!– end: TOP NAVBAR –>
<div class="main-content" >
<div class="wrap-content container" id="containe r">
<!– start: PAGE TITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >Admin | Add Doctor </h1>
</div>
<ol class="breadcrumb" >
<li>
<span>Admin</span>
</li>
<li class="active">
<span>Add Doctor </span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>

52
<!– start: BA SIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">
<div class="row">
<div class="col-md-12">

<div class="row margin -top-30">
<div class="col-lg-8 col-md-12">
<div class="panel panel -white">
<div class="panel-heading" >
<h5 class="panel-title">Add Doctor </h5>
</div>
<div class="panel-body">

<form role="form" name="adddoc"
method="post" onSubmit ="return valid();">
<div class="form-group">
<label for="DoctorSpecialization" >
Doctor Specialization
</label>
<select name="Doctorspecialization" class="form-control"
required ="required" >
<option value="">Select
Specialization </option>
<?php $ret=mysql_query( "select * from doctorspecilization" );
while($row=mysql_fetch_array( $ret))
{
?>
<option value="<?php echo
htmlentities( $row['specilization' ]);?>">
<?php echo
htmlentities ($row['specilization' ]);?>
</option>
<?php } ?>

</select>
</div>

<div class="form-group">
<label for="doctorname" >
Doctor Name
</label>
<input type="text" name="docname" class="form-control"
placeholder ="Enter Doctor Name" >
</div>

<div class="form-group">
<label for="address" >
Doctor Clinic Address
</label>
<textarea name="clinicaddress" class="form-control"
placeholder ="Enter Doctor Clinic Address" ></textarea>
</div>
<div class="form-group">
<label for="fess">
Doctor Consultancy Fees
</label>

53
<input type="text" name="docfees" class="form-control"
placeholder ="Enter Doctor Consultancy Fees" >
</div>

<div class="form-group">
<label for="fess">
Doctor Contact no
</label>
<input type="text" name="doccontact" class="form-control"
placeholder ="Enter Doctor Contact no" >
</div>

<div class="form-group">
<label for="fess">
Doctor Email
</label>
<input type="email" name="docemail" class="form-control"
placeholder ="Enter Doctor Email id" >
</div>

<div class="form-group">
<label for="exampleInputPassword1" >
Password
</label>
<input type="password" name="npass" class="form-control"
placeholder ="New Password" required ="require d">
</div>

<div class="form-group">
<label for="exampleInputPassword2" >
Confirm Password
</label>
<input type="password" name="cfpass" class="form-
control" placeholder ="Confirm Password" required ="required" >
</div>

<button type="submit" name="submit"
class="btn btn -o btn-primary" >
Submit
</button>
</form>
</div>
</div>
</div>

</div>
</div>
<div class="col-lg-12 col-md-12">
<div class="panel panel -white">

</div>

54
</div>
</div>
</div>
</div>
</div>

After the ad min user completes the form he/she has to click on the “Submit” button. After the Submit
button is clicked the information added is inserted in the database from the following code:
<?php
session_start() ;
//error_reporting(0);
include('include/config.php' );
include('include/checklogin.php' );
check_login() ;

if(isset($_POST['submit' ]))
{
$docspecialization =$_POST['Doctorspecialization' ];
$docname =$_POST['docname' ];
$docaddress =$_POST['clinicaddress' ];
$docfees =$_POST['docfees' ];
$doccontactno =$_POST['doccontact'];
$docemail =$_POST['docemail' ];
$password =md5($_POST['npass']);
$sql=mysql_query( "insert into
doctors(specilization,doctorName,address,docFees,contactno,docEmail,password)
values(' $docspecialization ','$docname ','$docaddress ','$docfees ','$doccontact no','$
docemail ','$password ')");
if($sql)
{
echo "<script> alert('Doctor info added Successfully');</script>" ;
echo "<script type='text/javascript'> document .location = 'location:Manage –
doctors.php'; </script>" ;

}
}
?>

3.5.2 Doctor Specialization
The Admin user can add doctor specialization in the web application. These operation is made from
the doctor -specialization.php. The Admin user will have to complete a form and then press the
“Submit” button in order to insert the information in the database. The form ha s the following code:
<?php include ('include/sidebar.php' );?>
<div class="app-content" >

<?php include ('include/header.php' );?>

<!– end: TOP NAVBAR –>

55
<div class="main-content" >
<div class="wrap-content container" id="container" >
<!– start: PAGE TITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >Admin | Add Doctor
Specialization </h1>
</div>
<ol class="breadcrumb" >
<li>
<span>Admin</span>
</li>
<li class="active" >
<span>Add Doctor Specialization </span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">
<div class="row">
<div class="col-md-12">

<div class="row margin -top-30">
<div class="col-lg-6 col-md-12">
<div class="panel panel -white">
<div class="panel-heading" >
<h5 class="panel-title">Doctor
Specialization </h5>
</div>
<div class="panel-body">
<p style="color:red;"><?php echo
htmlentities( $_SESSION ['msg']);?>
<?php echo htmlentities( $_SESSION ['msg']="");?></p>
<form role="form" name="dcotorspcl"
method="post" >
<div class="form-group">
<label for="exampleInputEmail1" >
Doctor Specialization
</label>
<input type="text" name="doctorspecilization" class="form-
control" placeholder ="Enter Doctor Specialization" >
</div>

<button type="submit" name="submit"
class="btn btn -o btn-primary" >
Submit
</button>
</form>
</div>
</div>
</div>

56

</div>
</div>
<div class="col-lg-12 col-md-12">
<div class="panel panel -white">

</div>
</div>
</div>

<div class="row">
<div class="col-md-12">
<h5 class="over-title margin -bottom-15">Manage <span
class="text-bold">Docter Specialization </span></h5>

<table class="table table -hover" id="sample -table-1">
<thead>
<tr>
<th class="center" >#</th>
<th>Specialization </th>
<th class="hidden -xs">Creation Date </th>
<th>Updation Date </th>
<th>Action</th>

</tr>
</thead>
<tbody>
<?php
$sql=mysql_query( "select * from doctorSpecilization" );
$cnt=1;
while($row=mysql_fetch_array( $sql))
{
?>

<tr>
<td class="center" ><?php echo $cnt;?>.</td>
<td class="hidden -xs"><?php echo
$row['specilization' ];?></td>
<td><?php echo $row['creationDate' ];?></td>
<td><?php echo $row['updationDate' ];?>
</td>

<td >
<div class="visible -md visible -lg hidden -sm
hidden-xs">
<a href="edit-doctor-specialization.php?id= <?php echo
$row['id'];?>" class="btn btn-transparent btn -xs" tooltip-placement ="top"
tooltip="Edit"><i class="fa fa-pencil"></i></a>

<a href="doctor -specilization.php?id= <?php echo $row['id']?>&del=delete"
onClick="return confirm('Are you sure you w ant to delete?' )"class="btn btn –
transparent btn -xs tooltips" tooltip-placement ="top" tooltip="Remove" ><i class="fa
fa-times fa fa -white"></i></a>
</div>
<div class="visible -xs visible -sm hidden -md
hidden-lg">

57
<div class="btn-group" dropdown is –
open="status.isopen" >
<button type="button" class="btn btn –
primary btn -o btn-sm dropdown -toggle" dropdown -toggle>
<i class="fa fa-cog"></i>&nbsp;<span
class="caret" ></span>
</button>
<ul class="dropdown -menu pull -right
dropdown -light" role="menu">
<li>
<a href="#">
Edit
</a>
</li>
<li>
<a href="#">
Share
</a>
</li>
<li>
<a href="#">
Remove
</a>
</li>
</ul>
</div>
</div></td>
</tr>

<?php
$cnt=$cnt+1;
}?>

</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<!– end: BASIC EXAMPLE –>
<!– end: SELECT BOXES –>

</div>
</div>
</div>

After the Admin user hits the Submit button the information from the completed form is inserted in
the Database from the following code:
<?php
session_start() ;
//error_reporting(0);
include('include/config.php' );

58
include('include/checklogin.php' );
check_login() ;
if(isset($_POST['submit' ]))
{
$sql=mysql_query( "insert into doctorSpecilization(specilization)
values('" .$_POST['doctorspecilization' ]."')");
$_SESSION ['msg']="Doctor Specialization added successfully !! ";
}

if(isset($_GET['del']))
{
mysql_query( "delete from doctorSpecilization where id =
'".$_GET['id']."'");
$_SESSION ['msg']="data deleted !!" ;
}
?>

3.5.3 Edit Doctor
The Admin user can edit doctors information from the edit -doctor.php file, after he/she completes the
formular the Submit button will send the data into the Database from the following code:
<?php
session_start() ;
//error_reporting(0);
include('include/config.php' );
include('include/checklogin.php' );
check_login() ;
$did=intval( $_GET['id']);// get doctor id
if(isset($_POST['submit' ]))
{
$docspecialization =$_POST['Doctorspecialization' ];
$docname =$_POST['docname' ];
$docaddress =$_POST['clinicaddress' ];
$docfees =$_POST['docfees' ];
$doccontactno =$_POST['doccontact' ];
$docemail =$_POST['docemail' ];
$sql=mysql_query( "Update doctors set
specilization=' $docspecialization ',doctorName=' $docname ',address=' $docaddress ',doc
Fees='$docfees ',contactno=' $doccontactno ',docEmail=' $docemail ' where id=' $did'");
if($sql)
{
echo "<script> alert('Doctor Details updated Successfully');</script>" ;

}
}

59
3.5.4 Edit Specialization
The Admin user can edit a doctor specialization. From the edit -doctor -specialization.php file. The
data added from the database it’s fetched and after the d ata is modified after clicking the Submit
button the new data is updated in the database:
<?php
session_start() ;
//error_reporting(0);
include('include/config.php' );
include('include/checklogin.php' );
check_login() ;
$id=intval( $_GET['id']);// get value
date_default_timezone_set( 'Asia/Kolkata' );// change according timezone
$currentTime = date( 'd-m-Y h:i:s A' , time () ) ;
if(isset($_POST['submit' ]))
{
$sql=mysql_query( "update doctorSpecilization set
specilization='" .$_POST['doctorspecilization' ]."',
updation Date='$currentTime 'where id=' $id'");
$_SESSION ['msg']="Doctor Specialization updated successfully !!" ;
}

?>

3.6 The Dashboard Page – Fuctionalities for the Doctor user
In this section we will describe the php file functionalities for the Dashboard when logg ed in with the
doctor user.
The Dashboard Page – for the doctor user has the following code:
</head>
<body>
<div id="app">
<?php include ('include/sidebar.php' );?>
<div class="app-content" >

<?php include ('include/header.php' );?>

<!– end: TOP NAVBAR –>
<div class="main-content" >
<div class="wrap-content container" id="container" >
<!– start: PAGE TITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >Doctor | Dashboard </h1>
</div>
<ol class="breadcrumb" >
<li>
<span>User</span>

60
</li>
<li class="active" >
<span>Dashboard </span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">
<div class="row">
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa -stack-2x text-primary" ></i> <i class="fa fa-smile-o fa-stack-1x fa-
inverse" ></i> </span>
<h2 class="StepTitle" >My Profile </h2>

<p class="links cl -effect-1">
<a href="edit-profile.php" >
Update Profile
</a>
</p>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel -white no -radius text -center">
<div class="panel-body">
<span class="fa-stack fa -2x"> <i class="fa fa-
square fa -stack-2x text-primary" ></i> <i class="fa fa-paperclip fa -stack-1x fa-
inverse" ></i> </span>
<h2 class="StepTitle" >My Appointments </h2>

<p class="cl-effect-1">
<a href="appointment -history.php" >
View Appointme nt History
</a>
</p>
</div>
</div>
</div>

</div>
</div>

3.6.1 Appointment History
The Doctor user can view the appointment history and verify if a new record is listed and also the
days and hours when he/she has the appointments.

61
The doctor user can also cancel appoiments if i t’s necessary. All of that is made from the
appointment -hostory.php file, and it has the following code:
<?php
session_start() ;
//error_reporting(0);
include('include/config.php' );
include('include/checklogin.php' );
check_login() ;
if(isset($_GET['cancel' ]))
{
mysql_query( "update appointment set doctorStatus='0' where id =
'".$_GET['id']."'");
$_SESSION ['msg']="Appointment canceled !!" ;
}
?>

<?php include ('include/sidebar.php' );?>
<div class="app-content">

<?php include ('include/header.php' );?>
<!– end: TOP NAVBAR –>
<div class="main-content" >
<div class="wrap-content container" id="container" >
<!– start: PAGE T ITLE –>
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" >Doctor | Appointment
History</h1>
</div>
<ol class="breadcrumb" >
<li>
<span>Doctor </span>
</li>
<li class="active" >
<span>Appointment History </span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">

<div class="row">
<div class="col-md-12">

<p style="color:red;"><?php echo
htmlentities( $_SESSION ['msg']);?>
<?php echo htmlentities( $_SESSION ['msg']="");?></p>
<table class="table table -hover" id="sample -table-1">
<thead>

62
<tr>
<th class="center" >#</th>
<th class="hidden -xs">Patient Name </th>
<th>Specialization </th>
<th>Consultancy Fee </th>
<th>Appointment Date / Time </th>
<th>Appointment Creation Date </th>
<th>Current Status </th>
<th>Action</th>

</tr>
</thead>
<tbody>
<?php
$sql=mysql_query( "select users.fullName as fname,appointment. * from appointment
join users on users.id=appointment.userId where
appointment.doctorId='" .$_SESSION ['id']."'");
$cnt=1;
while($row=mysql_fetch_array( $sql))
{
?>

<tr>
<td class="center" ><?php echo $cnt;?>.</td>
<td class="hidden -xs"><?php echo
$row['fname'];?></td>
<td><?php echo
$row['doctorSpecialization' ];?></td>
<td><?php echo $row['consultancyFees' ];?></td>
<td><?php echo $row['appointmentDate' ];?> /
<?php echo
$row['appointmentTime' ];?>
</td>
<td><?php echo $row['postingDate' ];?></td>
<td>
<?php if (($row['userStatus' ]==1) && ($row['doctorStatus' ]==1))
{
echo "Active" ;
}
if(($row['userStatus' ]==0) && ($row['doctorStatus' ]==1))
{
echo "Cancel b y Patient" ;
}

if(($row['userStatus' ]==1) && ($row['doctorStatus' ]==0))
{
echo "Cancel by you" ;
}

?></td>
<td >
<div class="visible -md visib le-lg hidden -sm
hidden-xs">
<?php if (($row['userStatus' ]==1) &&
($row['doctorStatus' ]==1))

63
{ ?>

<a href="appointment -history.php?id= <?php echo $row['id']?>&cancel=update"
onClick="return confirm('Are you sure you want to cancel this appointment
?')"class="btn btn -transparent btn -xs tooltips" title="Cancel Appointment"
tooltip-placement ="top" tooltip="Remove" >Cancel</a>
<?php } else {

echo "Canceled" ;
} ?>
</div>
<div class="visible -xs visible -sm hidden -md
hidden-lg">
<div class="btn-group" dropdown is –
open="status.isopen" >
<button type="button" class="btn btn –
primary btn -o btn-sm dropdown -toggle" dropdown -toggle>
<i class="fa fa-cog"></i>&nbsp;<span
class="caret" ></span>
</button>
<ul class="dropdown -menu pull -right
dropdown -light" role="menu">
<li>
<a href="#">
Edit
</a>
</li>
<li>
<a href="#">
Share
</a>
</li>
<li>
<a href="#">
Remove
</a>
</li>
</ul>
</div>
</div></td>
</tr>

<?php
$cnt=$cnt+1;
}?>

</tbody>
</table>
</div>
</div>
</div>

64

4 CONCLU SIONS
The main goal was to initiate a minimal interaction between stud ents and companies and I firmly
believe that I achieved that . Students have the possibility to be noticed by companies and their
growth, passion and interest can result in getting hired. Virtually all three parts (student, faculty,
company) will ultimatel y benefit from such interaction.
Based on feedback on articles, companies could figure out how to better target students to make
them even more curious and willing to continue in this area. Students would be more motivated to
receive this minimal attention in the application from companies. And, as an intermediary, the ACE
managed to create relationships and build a better image not only in Craiova but also in other major
cities of Romania.
Naturally there i s a lot of room for improvement . If the applicati on reaches its original target , this
does not mean it is the ideal application. Throughout its development, I have noticed many aspects
that can be enhanced and many features that can be implemented to turn it into an application as
technically complex as i t is useful in several respects.
It has started as a small forum but it can turn into much more than that. What is important is that
the first step has been achieved – we have the students in the same place together with IT companies.
As an improvement ide ea, since most companies have internal programs for students (interships,
academies, trainings, etc.), the selection and enrollment process could somehow be portrayed in this
application, as I repeat, we already have the same place and students and compani es.
Another idea would be that the situation of college projects done by students could be somehow
made public for companies (of course, invisible to other students , and only with the student’s
approval ). This would be somewhat an extension of the idea abo ve, ideal for situations where there
are a lot of students enrolled in an academy and companies do not have much data collected about

65
them and this could give the chance to the students to impress some companies in the field they wish
to start their career s.

66
5 BIBLIOGRA PHY
During the planning and development of this dissertation project the followi ng web resources were consulted:

 http://php.net/ – PHP
 https://codeigniter.com/ – CodeIgniter
 https://www.froala.com/wysiwyg -editor – Froala Editor
 http://phpmailer.worxware.c om/index.php?pg=tutorial – PHPMailer
 https://en.wikipedia.org/wiki/MySQL – MySQL
 http://www.w3schools.com/html/default.asp – HTML
 http://www.w3schools.com/css/default.asp – CSS
 http://www.w3schools.com/js/default.asp – JavaScript
 https://jquery.com – jQuery
 http://www.w3schools.com/json/default.asp – JSON
 http://getbootstrap.com/ – Bootstrap
 https://ro.wikipedia.org/wiki/Model -view -controller – MVC pattern
 http://www.w3schools.com/ajax/default.asp – AJAX
 https://www.apachefriends.org/index.html – XAMPP
 https://searchoracle.techtarget.com/definition/MySQL – MySQL
 https://www.tutorialspoint.com/php/php_introduction.htm – PHP
 https://skillcrush.com/2012/04/03/css/ – CSS
 https://javascript.info/intro – JavaScript

67
A. SOURCE CODE

 appointment -history .php
<?php
session_start();
//error_reporting(0);
include('include/config.php');
include('include/checklogin.php');
check_login();
if(isset($_GET['cancel']))
{
mysql_query("update a ppointment set
userStatus='0' where id = '".$_GET['id']."'");
$_SESSION['msg']="Your appointment canceled !!";
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>User | Appointment History</title>
<meta charset="utf -8" />
<meta name="viewport" content="width=device -width,
initial-scale=1.0, user -scalable=0, minimum -scale=1.0, maximum –
scale=1.0">
<meta name="apple -mobile-web-app-capable" content="yes">
<meta name="apple -mobile-web-app-status-bar-style"
content="black">
<meta content="" name="description" />
<meta content="" name="author" />
<link
href="http://fonts.googleapis.com/css?family=Lato:300,400,400italic,600,
700|Raleway:300,400,500,600,700|Crete+Round:400italic" rel="stylesheet"
type="text/css" />
<link rel=" stylesheet"
href="vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="vendor/fontawesome/css/font –
awesome.min.css">
<link rel="stylesheet" href="vendor/themify -icons/themify –
icons.min.css">
<link href="vendor/animate.css/animate.min .css"
rel="stylesheet" media="screen">
<link href="vendor/perfect -scrollbar/perfect –
scrollbar.min.css" rel="stylesheet" media="screen">
<link href="vendor/switchery/switchery.min.css"
rel="stylesheet" media="screen">
<link href="vendor/bootstrap -touchspin/jquery.bootstrap –
touchspin.min.css" rel="stylesheet" media="screen">
<link href="vendor/select2/select2.min.css"
rel="stylesheet" media="screen">
<link href="vendor/bootstrap -datepicker/bootstrap –
datepicker3.standalone.min.css" rel="stylesheet" m edia="screen">
<link href="vendor/bootstrap -timepicker/bootstrap –
timepicker.min.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="assets/css/styles.css">
<link rel="stylesheet" href="assets/css/plugins.css">
<link rel="stylesheet" href="assets/css/themes/theme –
1.css" id="skin_color" />
</head>
<body>
<div id="app">
<?php include('include/sidebar.php');?>

68
<div class="app -content">

<?php include('include/header.php');?>
<!– end: TOP NAVBAR –>
<div class="main -content" >
<div class="wrap -content container" id="container">
<!– start: PAGE TITLE –>
<section id="page -title">
<div class="row">
<div class="col -sm-8">
<h1 class="mainTitle">User | Appointment History</h1>
</div>
<ol class="breadcrumb">
<li>
<span>User </span>
</li>
<li class="active">
<span>Appointment History</span>
</li>
</ol>
</div>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw bg -white">

<div class="row">
<div class="col -md-12">

<p style="color: red;"><?php echo htmlentities($_SESSION['msg']);?>
<?php echo htmlentities($_SESSION['msg']="");?></p>
<table class="table table -hover" id="sample -table-1">
<thead>
<tr>
<th class="center">#</th>
<th class="hidden -xs">Doctor Name</th>
<th>Specialization</t h>
<th>Consultancy Fee</th>
<th>Appointment Date / Time </th>
<th>Appointment Creation Date </th>
<th>Current Status</th>
<th>Action</th>

</tr>
</thead>
<tbody>
<?php
$sql=mysql_query("select doctors.doctorName as docname,appointment.*
from appointment join doctors on doctors.id=appointment.doctorId where
appointment.userId='".$_SESSION['id']."'");
$cnt=1;
while($row=mysql_fetch_array($sql))
{
?>

<tr>
<td class="center"><?php echo $cnt;?>.</td>
<td class="hidden -xs"><?php echo $row['docname'];?></td>
<td><?php echo $row['doctorSpecialization'];?></td>
<td><?php echo $row['consultancyFees'];?></td>
<td><?php echo $row['appointmentDate'];?> / <?php echo
$row['appointmentTime'];?>
</td>
<td><?php echo $row['postingDate'];?></td>

69
<td>
<?php if(($row['userSta tus']==1) && ($row['doctorStatus']==1))
{
echo "Active";
}
if(($row['userStatus']==0) && ($row['doctorStatus']==1))
{
echo "Cancel by You";
}

if(($row['userStatus']==1) && ($row['doctorStatus']==0))
{
echo "Cancel by Doctor";
}

?></td>
<td >
<div class ="visible -md visible -lg hidden -sm hidden -xs">
<?php if(($row['userStatus']==1) && ($row['doctorStatus']==1))
{ ?>

<a href="appointment -history.php?id=<?php echo
$row['id']?>&cancel=update" onClick="return confirm('Are you sure you
want to cancel this app ointment ?')"class="btn btn -transparent btn -xs
tooltips" title="Cancel Appointment" tooltip -placement="top"
tooltip="Remove">Cancel</a>
<?php } else {

echo "Canceled";
} ?>
</div>
<div class="visible -xs visible -sm hidden -md hidden -lg">
<div class="btn -group" dropdown is -open="status.isopen">
<button type="button" class="btn btn -primary btn -o btn-sm dropdown –
toggle" dropdown -toggle>
<i class="fa fa -cog"></i>&nbsp;<span class="caret"></span>
</button>
<ul class="dropdown -menu pull -right dropdown -light" role= "menu">
<li>
<a href="#">
Edit
</a>
</li>
<li>
<a href="#">
Share
</a>
</li>
<li>
<a href="#">
Remove
</a>
</li>
</ul>
</div>
</div></td>
</tr>

<?php
$cnt=$cnt+1;
}?>

70
</tbody>
</table>
</div>
</div>
</div>

<!– end: BASIC EXAMPLE –>
<!– end: SELECT B OXES –>

</div>
</div>
</div>
<!– start: FOOTER –>
<?php include('include/footer.php');?>
<!– end: FOOTER –>

<!– start: SETTINGS –>
<?php include('include/setting.php');?>

<!– end: SETTINGS –>
</div>
<!– start: MAIN JAVASCRIPTS –>
<script src= "vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="vendor/modernizr/modernizr.js"></script>
<script src="vendor/jquery -cookie/jquery.cookie.js"></script>
<script src="vendor/perfect -scrollbar/p erfect-
scrollbar.min.js"></script>
<script src="vendor/switchery/switchery.min.js"></script>
<!– end: MAIN JAVASCRIPTS –>
<!– start: JAVASCRIPTS REQUIRED FOR THIS PAGE ONLY –>
<script src="vendor/maskedinput/jquery.maskedinput.min.js"></script>
<script src="vendor/bootstrap -touchspin/jquery.bootstrap –
touchspin.min.js"></script>
<script src="vendor/autosize/autosize.min.js"></script>
<script src="vendor/selectFx/classie.js"></script>
<script src="vendor/selectFx/selectFx.js"></script>
<script src="vendor /select2/select2.min.js"></script>
<script src="vendor/bootstrap -datepicker/bootstrap –
datepicker.min.js"></script>
<script src="vendor/bootstrap -timepicker/bootstrap –
timepicker.min.js"></script>
<!– end: JAVASCRIPTS REQUIRED FOR THIS PAGE ONLY –>
<!– start: CLIP -TWO JAVASCRIPTS –>
<script src="assets/js/main.js"></script>
<!– start: JavaScript Event Handlers for this page –>
<script src="assets/js/form -elements.js"></script>
<script>
jQuery(document).ready(function() {
Main.init();
FormElements.init() ;
});
</script>
<!– end: JavaScript Event Handlers for this page –>
<!– end: CLIP -TWO JAVASCRIPTS –>
</body>
</html>

 book -appointment .php
<?php
session_start();
//error_reporting(0);

71
include('include/config.php');
include('include/checklogin.php');
check_login();

if(isset($_POST['submit']))
{

$specilization=$_POST['Doctorspecialization'];
$doctorid=$_POST['doctor'];
$userid=$_SESSION['id'];
$fees=$_POST['fees'];
$appdate=$_POST['appdate'];
$time=$_POST['apptime'];
$userstatus=1;
$docstatus=1;

$query=mysql_query("insert into
appointment(doctorSpecialization,doctorId,userId,consultancyFees,appointmentDate,ap
pointmentTime,userStatus,doctorStatus)
values('$specilization','$doctorid','$userid','$fees','$appdate','$time','$userstat
us','$docstatus')");
if($query)
{
echo "<script>alert('Your appointment successfully
booked');</script>";
}

}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>User | Book Appointment</title>
<meta charset="utf -8" />
<meta name="viewport" content="width=device -width, initial -scale=1.0,
user-scalable=0, minimum -scale=1.0, maximum -scale=1.0">

72
<meta name="apple -mobile-web-app-capable" content="yes">
<meta name="apple -mobile-web-app-status-bar-style" content="black">
<meta content="" name="description" />
<meta content="" name="author" />
<link
href="http://fonts.googleapis.com/css?family=Lato:300,400,400italic,600,700|Raleway
:300,400,500,600,700|Crete+Round:400italic" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="vendor/bootstrap/css/boots trap.min.css">
<link rel="stylesheet" href="vendor/fontawesome/css/font –
awesome.min.css">
<link rel="stylesheet" href="vendor/themify -icons/themify –
icons.min.css">
<link href="vendor/animate.css/animate.min.css" rel="stylesheet"
media="screen">
<link href="vendor/perfect -scrollbar/perfect -scrollbar.min.css"
rel="stylesheet" media="screen">
<link href="vendor/switchery/switchery.min.css" rel="stylesheet"
media="screen">
<link href="vendor/bootstrap -touchspin/jquery.bootstrap –
touchspin.min.css" re l="stylesheet" media="screen">
<link href="vendor/select2/select2.min.css" rel="stylesheet"
media="screen">
<link href="vendor/bootstrap -datepicker/bootstrap –
datepicker3.standalone.min.css" rel="stylesheet" media="screen">
<link href="vendor/bootstra p-timepicker/bootstrap -timepicker.min.css"
rel="stylesheet" media="screen">
<link rel="stylesheet" href="assets/css/styles.css">
<link rel="stylesheet" href="assets/css/plugins.css">
<link rel="stylesheet" href="assets/css/themes/theme -1.css"
id="skin_color" />
<script>
function getdoctor(val) {
$.ajax({
type: "POST",
url: "get_doctor.php",
data:'specilizationid='+val,
success: function(data){
$("#doctor").html(data);
}

73
});
}
</script>

<script>
function getfee(val) {
$.ajax({
type: "PO ST",
url: "get_doctor.php",
data:'doctor='+val,
success: function(data){
$("#fees").html(data);
}
});
}
</script>

</head>
<body>
<div id="app">
<?php include('include/sidebar.php');?>
<div class="app -content">

<?php include('include/header.php');?>

<!– end: TOP NAVBAR –>
<div class="main -content" >
<div class="wrap -content container"
id="container">
<!– start: PAGE TITLE –>

74
<section id="page -title">
<div class="row ">
<div class="col -sm-8">
<h1
class="mainTitle">User | Book Appointment</h1>

</div>
<ol class="breadcrumb">
<li>

<span>User</span>
</li>
<li class="active">
<span>Book
Appointment</span>
</li>
</ol>
</section>
<!– end: PAGE TITLE –>
<!– start: BASIC EXAMPLE –>
<div class="container -fluid container -fullw
bg-white">
<div class="row">
<div class="col -md-12">

<div class="row margin –
top-30">
<div class="col –
lg-8 col-md-12">
<div
class="panel panel -white">

<div class="panel -heading">

<h5 class="panel -title">Book Appointment</h5>

</div>

<div class="panel -body">

75
<p style="color:red;"><?php
echo htmlentities($_SESSION['msg1']);?>
<?php echo
htmlentities($_SESSION['msg1']="");?></p>

<form role="form" name="book" method="post" >

<div class= "form-group">

<label for="DoctorSpecialization">

Doctor Specialization

</label>
<select name="Doctorspecialization"
class="form -control" onChange="getdoctor(this.value);" required="required">

<option value="">Select Specialization</option>
<?php $ret=mysql_query("select * from doctorspecilization");
while($row=mysql_fetch_array($ret))
{
?>

<option value="<?php echo
htmlentities($row['specilization']);?>">

<?php echo htmlentities($row['specilization']);?>

</option>

<?php } ?>

</select>

</div>

76

<div class="form -group">

<label for="doctor">

Doctors

</label>
<select name="doctor" class="form -control"
id="doctor" onChange="getfee(this.value);" required="required">
<option value="">Select Doctor</option>
</select>

</div>

<div class="form -group">

<label for="consultancyfees">

Consultancy Fees

</label>
<select name="fees" class="form -control" id="fees"
readonly>

</select>

</div>

<div cla ss="form -group">

<label for="AppointmentDate">

77

Date

</label>
<input class="form –
control datepicker" name="appdate" type="date" required="required">

</div>

<div class="form -group">

<label for="Appointmenttime">

Time

</label>
<input class="form –
control datepicker" name="apptime" type="time" required="required">

</div>

<button type="submit" name="submit" class="btn btn -o btn-primary">

Submit

</button>

</form>

</div>
</div>
</div>

</div>
</div>

78

</div>
</div>

<!– end: BASIC EXAMPLE –>

<!– end: SELECT BOXES –>

</div>
</div>
</div>
<!– start: FOOTER –>
<?php include('include/foote r.php');?>
<!– end: FOOTER –>

<!– start: SETTINGS –>
<?php include('include/setting.php');?>

<!– end: SETTINGS –>
</div>
<!– start: MAIN JAVASCRIPTS –>
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor /bootstrap/js/bootstrap.min.js"></script>
<script src="vendor/modernizr/modernizr.js"></script>
<script src="vendor/jquery -cookie/jquery.cookie.js"></script>
<script src="vendor/perfect -scrollbar/perfect –
scrollbar.min.js"></script>
<script src="ven dor/switchery/switchery.min.js"></script>
<!– end: MAIN JAVASCRIPTS –>

79
<!– start: JAVASCRIPTS REQUIRED FOR THIS PAGE ONLY –>
<script src="vendor/maskedinput/jquery.maskedinput.min.js"></script>
<script src="vendor/bootstrap -touchspin/jquery.boo tstrap-
touchspin.min.js"></script>
<script src="vendor/autosize/autosize.min.js"></script>
<script src="vendor/selectFx/classie.js"></script>
<script src="vendor/selectFx/selectFx.js"></script>
<script src="vendor/select2/select2.min.js"></script>
<script src="vendor/bootstrap -datepicker/bootstrap –
datepicker.min.js"></script>
<script src="vendor/bootstrap -timepicker/bootstrap –
timepicker.min.js"></script>
<!– end: JAVASCRIPTS REQUIRED FOR THIS PAGE ONLY –>
<!– start: CLIP -TWO JAVASCRIPTS –>
<script src="assets/js/main.js"></script>
<!– start: JavaScript Event Handlers for this page –>
<script src="assets/js/form -elements.js"></script>
<script>
jQuery(document).ready(function() {
Main.init();
FormElements.init();
});
</script>
<!– end: JavaScript Event Handlers for this page –>
<!– end: CLIP -TWO JAVASCRIPTS –>

<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>

</body>
</html>
check_availability .php

<?php
require_once ("include/config.php");
if(!empty($_POST["email"])) {

80
$email= $_POST["email"];

$result =mysql_query("SELECT email FROM users WHERE
email='$email'");
$count=mysql_num_rows($result);
if($count>0)
{
echo "<span style='color:red'> Email already exists . </span>";
echo "<script>$('#submit').prop('disabled',true);</script>";
} else{

echo "<span style='color:green'> Email available for Registration
.</span>";
echo "<script>$('#submit').prop('disabled',false);</script>";
}
}


 ?> application/controllers/ dbcontroller.php
<?php
$DB_host = "localhost";
$DB_user = "root";
$DB_pass = "";
$DB_name = "ingram";
try
{
$DB_con = new PDO("mysql:host={$DB_host};dbname={$DB_name}",$DB_user,$DB_pass);
$DB_con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
}
catch(PDOException $e)
{
$e->getMessage();
}
?>

 application/assets/form -elements.js
var FormElements = function() {"use strict";

//function to initiate jquery.maskedinput
var maskInputHandler = function() {
$.mask.definitions['~'] = '[+ -]';
$('.input -mask -date').mask('99/99/9999');
$('.input -mask -phone').mask('(999) 999 -9999');
$('.input -mask -eyescript').mask('~9.99 ~9.99 999');
$(".input -mask -product").mask("a* -999-a999", {
placeholder: " ",
completed: function() {

81
alert("You typ ed the following: " + this.val());
}
});
};
//function to initiate bootstrap -touchspin
var touchSpinHandler = function() {
$("input[name='demo1']").TouchSpin({
min: 0,
max: 100,
step: 0.1,
decimals: 2,
boostat: 5,
maxboostedstep : 10,
postfix: '%'
});
$("input[name='demo2']").TouchSpin({
min: -1000000000,
max: 1000000000,
stepinterval: 50,
maxboostedstep: 10000000,
prefix: '$'
});
$("input[name='demo3']").TouchSpin({
verticalbuttons: true
});
$("in put[name='demo4']").TouchSpin({
verticalbuttons: true,
verticalupclass: 'fa fa -plus',
verticaldownclass: 'fa fa -minus'
});
$("input[name='demo5']").TouchSpin({
postfix: "a button",
postfix_extraclass: "btn btn -default"
});
$("input[n ame='demo6']").TouchSpin({
postfix: "a button",
postfix_extraclass: "btn btn -default"
});
$("input[name='demo7']").TouchSpin({
prefix: "pre",
postfix: "post"
});
};

var autosizeHandler = function() {
$('.autosize.area -animated').app end(" \n");
autosize($('.autosize'));
};
var select2Handler = function() {
$(".js -example -basic -single").select2();
$(".js -example -basic -multiple").select2();
$(".js -example -placeholder -single").select2({
placeholder: "Select a state"
});
var data = [{
id: 0,
text: 'enhancement'
}, {

82
id: 1,
text: 'bug'
}, {
id: 2,
text: 'duplicate'
}, {
id: 3,
text: 'invalid'
}, {
id: 4,
text: 'wontfix'
}];
$(".js -example -data-array -selected").select2({
data: data
});
$(".js -example -basic -hide-search").select2({
minimumResultsForSearch: Infinity
});
};
var datePickerHandler = function() {
$('.datepicker').datepicker({
autoclose: true,
todayHighlight: true
});
$('.format -datepicker').datepicke r({
format: "M, d yyyy",
todayHighlight: true
});

};
var timePickerHandler = function() {
$('#timepicker -default').timepicker();
};
return {
//main function to initiate template pages
init: function() {
maskInputHandler();
touchSpinHandler();
autosizeHandler();
select2Handler();
datePickerHandler();
timePickerHandler();
}
};
}();
B. CD / DVD
A dvd with the presentation and dissertation paper has been included.

Similar Posts