In this article I would like to share with you another conversion program that I wrote using Javascript as my programming language I called this program Miles To Kilometers Converter. What does the program will do is to ask the user how many miles to be converted into kilometers equivalent. I also added some error handling codes which allows us to filter invalid values from our user of the program.
If you have some questions please send me an email at jakerpomperada@yahoo.com and jakerpomperada@gmail.com.
Program Listing
<html>
<title>Miles To Kilometer Converter </title>
<style>
body {
font-size:20px;
font-family:arial;
color:blue;
}
label{
display: table-cell;
text-align: justify;
}
input {
display: table-cell;
}
div.row{
display:table-row;
}
</style>
<script language="JavaScript">
function kilomet()
{
var miles =document.getElementById("value1").value;
if (isNaN(miles)|| (miles <0 ) || (miles =="")){
alert (" Enter a valid number! Try Again... ");
document.getElementById("value1").value = "";
document.getElementById("value1").focus();
}
else {
solve= (miles * 1.60934);
document.getElementById("kilo").value= solve.toFixed(5)
document.getElementById("miles").value= miles;
}
}
function clear_me() {
document.getElementById("kilo").value="";
document.getElementById("value1").value="";
document.getElementById("value1").focus();
}
</script>
<body style='background-color:lightgreen'>
<div style='width:1100px;margin:auto'>
<br> <h1 align="center">Miles To Kilometer Converter</h2>
<br>
<div class="row"><label> How many miles </label> <input type="text" name="value1" id="value1" value="" size=5/> </div>
<br><button onclick="kilomet();"
title="Click here to find equivalent of miles to kilometers.">
Convert To Kilometers</button>
<button onclick="clear_me();" title="Click here to clear text fields.">
Clear</button>
<br><br><br>
<div class="row"><label> The <input id="miles" size="5" readonly>
miles is equivalent to <input id="kilo" size="5" readonly> in kilometers. </label> <br> </div>
<br>
</body>
</html>