Monday, March 30, 2015

Miles To Kilometers Converter in Javascript

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

People here in the Philippines who wish to contact me can reach me at my mobile number 09173084360






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>

No comments:

Post a Comment