You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
85 lines
2.2 KiB
85 lines
2.2 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
|
|
<title>Input Screen</title>
|
|
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
|
|
<script>
|
|
let value_error = false; // Flag if Lat/Lon values are out of range.
|
|
let latitude_low = 38.0;
|
|
let latitude_high = 40.0;
|
|
let longitude_low = -96.0;
|
|
let longitude_high = -94.0;
|
|
|
|
function inRange(nVal, nLow, nHigh)
|
|
{
|
|
nVal = Number(nVal);
|
|
nLow = Number(nLow);
|
|
nHigh = Number(nHigh);
|
|
return (nVal >= nLow) && (nVal <= nHigh);
|
|
}
|
|
|
|
function submitForm()
|
|
{
|
|
// Clear values
|
|
value_error = false;
|
|
$("#latitude_error").html('');
|
|
$("#longitude_error").html('');
|
|
// Set Vars
|
|
let nLatitude = $("#latitude").val();
|
|
let nLongitude = $("#longitude").val();
|
|
|
|
if ((!$.isNumeric(nLatitude)) || (!inRange(nLatitude,latitude_low,latitude_high)))
|
|
{
|
|
$("#latitude_error").html('Please enter a value between ' + latitude_low + ' and ' + latitude_high);
|
|
value_error = true;
|
|
}
|
|
|
|
if ((!$.isNumeric(nLongitude)) || (!inRange(nLongitude,longitude_low,longitude_high)))
|
|
{
|
|
$("#longitude_error").html('Please enter a value between ' + longitude_low + ' and ' + longitude_high);
|
|
value_error = true;
|
|
}
|
|
|
|
// if Lat or Lon values are out of range return to form.
|
|
if (value_error) { return; }
|
|
|
|
|
|
|
|
alert('Submit Form');
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div>
|
|
<p>Please enter a Latitude and Longitude</p>
|
|
</div>
|
|
</header>
|
|
<section>
|
|
<form action="" method="get">
|
|
<div id="latitude_error"></div>
|
|
<div>
|
|
<label for="latitude">Latitude:</label>
|
|
<input type="text" name="latitude" id="latitude" />
|
|
</div>
|
|
<div id="longitude_error"></div>
|
|
<div>
|
|
<label for="longitude">Longitude:</label>
|
|
<input type="text" name="longitude" id="longitude" />
|
|
</div>
|
|
<div>
|
|
<input type="button" onClick="submitForm()" value=" Save ">
|
|
</div>
|
|
</form>
|
|
</section>
|
|
<section>
|
|
<div>Results:</div>
|
|
<div id="results"></div>
|
|
</section>
|
|
<footer>
|
|
<p>Copyright 2019 - Rick Hays, All rights reserved.</p>
|
|
</footer>
|
|
</body>
|
|
</html>
|