Follow this instructions.
conference.js //Sahar Al Seesi //11/03/2021 //Client for parent teacher conference registration const urlPrefix="http://localhost/"; sendLoadTimesRequest(); // call sendLoadTimesRequest when page is loaded //////////////////////// MODIFY THIS CODE /////////////////////////// // Change Myfn to the fucntion you will write to send an AJAX request // date, time, and student name for the request appointment // check the lecture slides document.getElementById("bookAppt").addEventListener("click",Myfn); let availableTimes = []; //////////////////////// INSERT CODE HERE /////////////////////////// // write the click event handler for bookAppr button // This function should create and send an AJAX request with /schedule // as the path name and a query string that includes the time, date, and name the user // types on the page function sendLoadTimesRequest() { let AJAX = new XMLHttpRequest(); //create AJAX object AJAX.onerror = function() { //attach error even handler alert("Network error"); } AJAX.onload = function() { //attach load event handler if (this.status == 200){ //if server resturn status 200 (success) //convert JSON string to an object and extract the updated available times // the object responseObj = JSON.parse(this.responseText); availableTimes = responseObj.times updateTimes(availableTimes); } //if else{ //if status is not 200, display error alert(this.responseText); //debugging console.log(this.status); console.log(this.responseText); } //else } //onload //setup the connection parameters AJAX.open("GET",urlPrefix+"load"); AJAX.send(); } // Use this function if you need it // This function converts an object to a query string to be included in the URL function queryObjectToString(query) { // get the properties in the query object // Example: for {message:"Hi I am sending an AJAX request", name: "Sahar"}; // properties will be ["message", "name" ] let properties = Object.keys(query); // create a string int the format "propert=value" for each property in query // arrOfQuesryStrings will be ["message=Hi I am sending an AJAX request", "name=Sahar"] let arrOfQuesryStrings = properties.map(prop => prop+"="+query[prop]); //combine the strings in arrOfQuesryStrings wuth & // return value will be "message=Hi I am sending an AJAX request&name=Sahar" return(arrOfQuesryStrings.join('&')); } function updateTimes(times) { let table = document.getElementById('conferenceTable'); let tableRows = table.getElementsByTagName('tr'); let rowCount = tableRows.length; console.log(rowCount); for (let x=rowCount-1; x>0; x--) { console.log(x); table.deleteRow(x); } let row = null; let cell = null; let dateStr = ""; let dateObj = {}; let month = 0; for (time of times) { console.log("adding row"); row = table.insertRow(-1); cell = row.insertCell(0); dateObj = new Date(time.dt); month = 1+ dateObj.getMonth(); dateStr = dateObj.getFullYear() + "-" + month +"-" + dateObj.getDate(); cell.innerHTML = dateStr; cell = row.insertCell(1); cell.innerHTML = time.tm; console.log(typeof(time.dt)) } } __MACOSX/._conference.js conferenceAppForUpload/fileServer.js // Sahar Al Seesi // 09/29/2020 // Module exports one function that reads and serves up statis files const fs = require('fs'), path = require('path'), utils = require('./utils'); exports.serve_static_file = function (fileName, res) { fs.readFile(fileName,function(err,data) { if (err) { // readFile generates an err object let out = { error: "not_found",message: "'" + fileName + "' not found" }; utils.sendJSONObj(res,404,out); } else { //readFile success let ct = content_type_for_path(fileName); //get contect type res.writeHead(200, { "Content-Type" : ct }); res.write(data); res.end(); } }); } //function returns content type based on file extension function content_type_for_path (file) { var ext = path.extname(file); switch (ext.toLowerCase()) { case '.html': return "text/html"; case ".js": return "text/javascript"; case ".css": return 'text/css'; case '.jpg': case '.jpeg': return 'image/jpeg'; default: return 'text/plain'; } } __MACOSX/conferenceAppForUpload/._fileServer.js conferenceAppForUpload/public_html/js/conference.js //Sahar Al Seesi //11/03/2021 //Client for parent teacher conference registration const urlPrefix="http://localhost/"; sendLoadTimesRequest(); // call sendLoadTimesRequest when page is loaded //////////////////////// MODIFY THIS CODE /////////////////////////// // Change Myfn to the fucntion you will write to send an AJAX request // date, time, and student name for the request appointment // check the lecture slides document.getElementById("bookAppt").addEventListener("click",Myfn); let availableTimes = []; //////////////////////// INSERT CODE HERE /////////////////////////// // write the click event handler for bookAppr button // This function should create and send an AJAX request with /schedule // as the path name and a query string that includes the time, date, and name the user // types on the page function sendLoadTimesRequest() { let AJAX = new XMLHttpRequest(); //create AJAX object AJAX.onerror = function() { //attach error even handler alert("Network error"); } AJAX.onload = function() { //attach load event handler if (this.status == 200){ //if server resturn status 200 (success) //convert JSON string to an object and extract the updated available times // the object responseObj = JSON.parse(this.responseText); availableTimes = responseObj.times updateTimes(availableTimes); } //if else{ //if status is not 200, display error alert(this.responseText); //debugging console.log(this.status); console.log(this.responseText); } //else } //onload //setup the connection parameters AJAX.open("GET",urlPrefix+"load"); AJAX.send(); } // Use this function if you need it // This function converts an object to a query string to be included in the URL function queryObjectToString(query) { // get the properties in the query object // Example: for {message:"Hi I am sending an AJAX request", name: "Sahar"}; // properties will be ["message", "name" ] let properties = Object.keys(query); // create a string int the format "propert=value" for each property in query // arrOfQuesryStrings will be ["message=Hi I am sending an AJAX request", "name=Sahar"] let arrOfQuesryStrings = properties.map(prop => prop+"="+query[prop]); //combine the strings in arrOfQuesryStrings wuth & // return value will be "message=Hi I am sending an AJAX request&name=Sahar" return(arrOfQuesryStrings.join('&')); } __MACOSX/conferenceAppForUpload/public_html/js/._conference.js __MACOSX/conferenceAppForUpload/public_html/._js conferenceAppForUpload/public_html/conference.html Available times Date Time Student name Date Time