Write a getFlightstatus ( function that initiates an Ajax call to a server with
ID: 3749691 • Letter: W
Question
Write a getFlightstatus ( function that initiates an Ajax call to a server with the following details. 1. 2. The API endpoint is located at the URL https://notareal.site/flightstatus In response to a GET request to the endpoint with the properties flightcode and date, the API will return JSON listing the current flight status. 3. The getFlightStatusfunction will be called from a web page containing two text cinput> elements with IDs flightCode and flightDate, that are used to specify the flight code and date. When the server response is received, the function flightStatusResponse should be called For the previous problem, write a flightstatusResponse function that update a with the ID currentStatus to list the current flight status. The server's JSON response will consist of the keys "Flight Status", "Scheduled Departure", and "Estimated Departure", where each key's value is a stringExplanation / Answer
index.php file -------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<form id="getDetail" method="GET">
Flight Code: <input id = 'inputCode' type="text" name="flightcode"><br>
Date: <input id = 'inputDate' type="date" name="flightdate"><br>
<input type="submit" value="Submit">
</form>
<div class="currentStatus"></div>
</body>
<script>
$(document).ready(function (e) {
$("#getDetail").on('submit',(function(e) {
e.preventDefault();
getFlightStatus(new FormData(this));
}));
});
function getFlightStatus(data){
var code = $("#inputCode").val();
var date = $("#inputDate").val();
$.ajax({
url: "display.php",
type: "POST",
data: data,
contentType: false,
cache: false,
processData:false,
success: function(data)
{
flightStatusResponse(data);
}
});
}
function flightStatusResponse(obj){
$('.currentStatus').html('<div>Flight Status:'+obj.flightStatus+'</div><div>Scheduled Departure:'+obj.scheduledDeparture+'</div><div>Estimated Departure:'+obj.EstimatedDeparture+'</div>');
}
</script>
</html>
display.php----------------------------------------------------------------------------------------------------------------------------------------
here in this code as you are not mentionedany database i am just fetching flight details from an array if you need any information let me know
<?php
$flightcode = $_REQUEST['flightcode'];
$flightdate = $_REQUEST['flightdate'];
header('Content-Type: application/json');
$content = array(
'2018-09-21' => array(123 => array('flightStatus' => 'arrived', 'scheduledDeparture'=>'2018-09-21', 'estimatedDeparture'=>'2018-09-21'),
124 => array('flightStatus' => 'arrived', 'scheduledDeparture'=>'2018-09-21', 'estimatedDeparture'=>'2018-09-21')),
'2018-09-22' => array(125 => array('flightStatus' => 'arrived', 'scheduledDeparture'=>'2018-09-21', 'estimatedDeparture'=>'2018-09-21')),
);
$data['flightStatus'] = $content[$flightdate][$flightcode]['flightStatus'];
$data['scheduledDeparture'] = $content[$flightdate][$flightcode]['scheduledDeparture'];
$data['EstimatedDeparture'] = $content[$flightdate][$flightcode]['estimatedDeparture'];
print json_encode($data);
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.