Professional Documents
Culture Documents
Problem Description:
The hospital wants to fix a unique appointment for all the patients and hence it has decided to
create an application that will fix the appointment from the given data of the patients.
Following are the files that contains code snippets.
HTML for webpage (complete implementation is given for
index.html you). You only have to run this. No change needs to be done
in this file.
script.js Add your code in this file for the functions given.
fixappointment(patientname, This function calculates the appointment date & time for a patien
appointmentdate,speciality,prefferedtime submitted. Then, sets the appstatus variable with the string : <pa
) appointment is confirmed on <appDate> for the speciality <s
<appointmentTime> after calculating the appointment time bas
preference & return this variable.
How is appDate or appointment date calculated (based on th
Use new Date().getHours(); javascript function to get the curren
If
Current hour is >= 8:00 and <= 12:00 & slot preferred is Mornin
Current hour is >=16.00 and <=22.00 & slot preferred is Evening
then
appointment time is the current hour & appointment date is the c
if
Current hour is >12:00 and < 16:00 & slot preferred is Morning (
Current hour is >=16.00 and <=22.00 & slot preferred is Mornin
then
appointment time is the next morning 8.00 and 9.00, respectivel
appointment date - next day is represented as : app_year-app_mo
where
getDate() + 1, .getMonth() and .getFullYear() are the relevant m
new Date()
Remember to precede date and month number with 0, if they
digit. Similarly, build logic for row2 & row4 in the table given b
Screenshot 1
Screenshot 2
Screenshot 3
Solution:
index.html
1 <html>
2 <head>
3
4 <style>
5 h1
6 {
7 color:#000000;
8 font-family:verdana;
9 text-align:center;
10 }
11
12 table{
13 border-collapse:separate;
14 border-spacing: 0 15px;
15 }
16 th{
17 background-color: #E9EBE2;
18 color: white;
19 }
20 th,td{
21 width: 150px;
22 text-align: center;
23 border: 1px solid black;
24 padding: 5px;
25 }
26
27 tr:hover {background-color: #a1a1a1;}
28
29 body
30 {
31 background-color:#E9EBE2;
32 }
33
34
35 </style>
36
37 <script src="script.js" lang="text/javascript"></script>
38
39 </head>
40
41 <body>
42
43 <center>
44 <h1>ONLINE DOCTOR APPOINTMENT</h1>
45
46 <table>
47 <tr>
48 <td>Patient Name
49 <td><input type="text" name="patientname" id="patientname" required
placeholder="Enter the patient name">
50 </tr>
51
52 <tr>
53 <td>Patient Age
54 <td><input type="text" name="patientage" id="patientage" required
placeholder="Enter the patient age">
55 </tr>
56
57 <tr>
58 <td>Mobile Number</td>
59 <td><input type="text" name="mobile" id="mobile" required
placeholder="Enter the patient mobile number"></td>
60 </tr>
61
62 <tr>
63 <td>Appointment Date
64 <td><input type="date" name="appointmentdate" id="appointmentdate"
required>
65 </tr>
66
67 <tr>
68 <td>Preferred Speciality
69 <td>
70 <select name="speciality" id="speciality" required>
71 <option value="General">General</option>
72 <option value="Pediatrics">Pediatrics</option>
73 <option value="ENT">ENT</option>
74 <option value="Neurology">Neurology</option>
75 <option value="Gastrology">Gastrology</option>
76 </select>
77 </tr>
78
79 <tr>
80 <td>Preffered Time
81 <td>
82 <select name="prefferedtime" id="prefferedtime" required>
83 <option value="Morning">Morning</option>
84 <option value="Evening">Evening</option>
85 </select>
86 </tr>
87
88 <tr>
89 <td><input type="submit" name="submit" value="Submit"
onclick="Booking()">
90 </tr>
91
92 </table>
93
94 <div id="result">
95 </div>
96
97 </center>
98 </body>
99 </html>
100
script.js
1
2 function
fixappointment(patientname,appointmentdate,speciality,prefferedtime)
3 {
4 // TODO - Write your logic here to check whether all the inputs
are valid based on the description to fix an appointment
5
6 var d=new Date();
7 var currentHour=d.getHours();
8 var appointmenttime;
9 var currentMonth=d.getMonth();
10 var currentYear=d.getFullYear();
11 var currentDate=new Date().getDate();
12
13 if((currentHour>=8 && currentHour<=12 &&
prefferedtime==='Morning')||(currentHour>=16 && currentHour<=22 &&
prefferedtime==='Evening'))
14 appointmenttime=currentHour;
15 else if(currentHour>=8 && currentHour<=12 &&
prefferedtime==='Evening')
16 appointmenttime=16;
17 else if(currentHour>=12 && currentHour<=16 &&
prefferedtime==='Morning')
18 {
19 appointmenttime=8;
20 appointmentdate=d.getDate()+1;
21 }
22 else if(currentHour>=12 && currentHour<=16 &&
prefferedtime==='Evening')
23 appointmenttime=currentHour+3;
24 else if(currentHour>=16 && currentHour<=22 &&
prefferedtime==='Morning')
25 {
26 appointmenttime=9;
27 appointmentdate=d.getDate()+1;
28 }
29
30 var appstatus=patientname + " your appointment is confirmed on
"+appointmentdate+" for the speciality "+speciality+" at
"+appointmenttime+":00";
31 return appstatus;
32 }
33
34
35 function Booking()
36 {
37 var patientname= document.getElementById("patientname").value;
38 var appointmentdate=
document.getElementById("appointmentdate").value;
39 var speciality= document.getElementById("speciality").value;
40 var prefferedtime=
document.getElementById("prefferedtime").value;
41 // Use document.getElementById() method to get the value of
patientname,appointmentdate,speciality,prefferedtime
42 if(validateDate(appointmentdate))
43 {
44 var appstatus =
fixappointment(patientname,appointmentdate,speciality,prefferedtime);
45 document.getElementById("result").innerHTML=appstatus;
46 }
47 else
48 document.getElementById("result").innerHTML="Please select the
current date";
49 // Invoke validateDate(appointmentdate) function and get the
returned boolean value. If its true, Invoke fixappointment function. Else
display the error message in <div> with id as result
50 // Invoke
fixappointment(patientname,appointmentdate,speciality,prefferedtime) function
and get the return value.
51 // Based on the return value display the results in div tag with id
as "result"
52 // Use document.getElementById("result").innerHTML to display
the output
53 }
54
55
56 function validateDate(appointmentdate){
57
58 //Validate the appointmentdate against current Date
59 var currentDate=new Date().getDate();
60 // If the appointmentdate is equal to current date then return
boolean true else return false
61 if(appointmentdate===currentDate)
62 return true;
63 else
64 return false;
65 }