The assignment: Currency Converter You will create a form that allows the user t
ID: 3748924 • Letter: T
Question
The assignment: Currency Converter You will create a form that allows the user to enter a quantity in inches. Then you will have a selec box that offers conversions to either feet, centimeters or yards. 1. Ask the user to enter a quantity in inches (in a textbox). 2. Have a select box with options for: Feet, Centimeters, Yards 3. If they chose inches, calculate the conversion as 1 inch 0.0833 feet. For Centimeters: 1 4. Because the user may enter a decimal amoung (e.g. 3.99), be sure to parse using the 5. Using a reference: Look up the 'toFixed'function and make sure that your result is 6. Output to a div section called results'. Output using the innerHTML command. inch = 2.54 centimeters. For Yards, I inch = 0.02778. 'parseFloat' option. outputted to 2 decimal places. Requirements Have at least two div or semantic tag sections: 1. One containing a heading/title for your page and an image of some kind. 2. Another section containing the form. Be sure to use ‘getElementById () , to retrieve your values from the form.Explanation / Answer
Here's the code for following conversion.
<!DOCTYPE html>
<html>
<title>Length Converter</title>
<body >
<div>
<h2>Length Converter</h2>
<p>Type a value in the Inches field to convert the value to Feet,Centimeters,Yards:</p>
</div>
<div>
<form>
<p>
<label>Inches</label>
<input id="inches" type="text" placeholder="Inches"> <!--User Input for entering quantity in inches-->
<select id="mySelect"> <!--Select box for options, Onchange function if selection changes value changes-->
<option value ="">Select</option>
<option value=1>Feet</option>
<option value=2>Centimeters</option>
<option value=3>Yards</option>
</select>
</p>
<div>Output: <span id="results"></span></div> <!-- Output will be displayed in this div using InnerHTML.-->
</form>
</div>
<script>
function LengthConverter() {
var x = parseFloat(document.getElementById("inches").value); //Parse float function to parse numbers as floating points.
var y = document.getElementById("mySelect").value; //Getting option using document.getElementById() Method to retrieve values.
if (y == 1) {
op=x*0.083333;
}
else if (y == 2) {
op= x*2.54;
}
else if (y == 3) {
op=x*0.02778
}
else {
greeting = "Select Correct Option";
}
document.getElementById("results").innerHTML= op.toFixed(2); //toFixed() function to make output limit to 2 decimals.
}
</script>
</body>
</html>
Thank you,
With regards.
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.