1.11M Members

Simple Temperature Conversion

 
0
 

Alright so im trying to write a simple temperature conversion but i can't seem to get it to work 100%. My problem seems to be that I want to check to see which field has had a number entered in it, and then run the correct conversion function accordingly. I'm rather new with JS so... I'm probably misusing isFinite, but I'm not sure how else to do it.

Any help would be great. Thanks! =]

<script type="text/javascript">
var fahrenheit= Number(document.temp_conv.fahr.value);
var celsius= Number(document.temp_conv.cels.value);
var kelvin= Number(document.temp_conv.kelv.value);

if(isFinite(fahrenheit)){

	function conversion() {
		var f= Number(document.temp_conv.fahr.value);
		var c= Number(document.temp_conv.cels.value);
		var k= Number(document.temp_conv.kelv.value);
		var f1= 5/9;
		var s1= f-32;

		var cels= f1*s1
		document.temp_conv.cels.value = cels;
	
		var kelv= cels + 273
		document.temp_conv.kelv.value = kelv;
	}
}

if(isFinite(celsius)){

	function conversion() {
		var f= Number(document.temp_conv.fahr.value);
		var c= Number(document.temp_conv.cels.value);
		var k= Number(document.temp_conv.kelv.value);

		var fahr= 1.8*c+32
		document.temp_conv.fahr.value = fahr;
	
		var kelv= c + 273
		document.temp_conv.kelv.value = kelv;
	}
}

if(isFinite(kelvin)){

	function conversion() {
		var f= Number(document.temp_conv.fahr.value);
		var c= Number(document.temp_conv.cels.value);
		var k= Number(document.temp_conv.kelv.value);
	
		var cels= k - 273
		document.temp_conv.kelv.value = kelv;
		
		var fahr= 1.8*cels+32
		document.temp_conv.fahr.value = fahr;
	}
}
</script>

</head>
<body>

<form name="temp_conv">
Fahrenheit<br />
<input type="text" name="fahr" id="fahr" value="" /><br />
Celsius<br />
<input type="text" name="cels" id="cels" value="" /><br />
Kelvin<br />
<input type="text" name="kelv" id="kelv" value="" />
<input type="button" value="Convert" onclick="conversion()" />
</form>
 
0
 

I'm just wondering why you're creating 3 functions named "conversion()" but they all have different bodies. O.o

 
0
 

um... one converts Fahrenheit to Celsius and kelvin, the other Celsius to Fahrenheit & Kelvin and the last Kelvin to Fahrenheit & Celsius

Is there a better way to go about this then?

 
0
 

I'm just thinking you should create three different functions so that the function names don't interfere with one another.

For example, create a function called conversion and create three more called, convertCelisius, convertFarenheit, convertKelvin. Run a check to see which fields are filled out with conversion and execute one of the three accordingly.

That way if there's more than one field filled out, you can always catch it with an if statement and throw out a warning/error.

I hope this helps.

 
0
 

Not exactly sure what you mean, like I said I'm fairly new with this. But, i tried creating just one main function and then running it all through if statements that check to see if the field is populated with a finite number. But it still doesn't work. I have a strung hunch I'm using isFinite wrong though. Am I?

var fahrenheit= Number(document.temp_conv.fahr.value);
var celsius= Number(document.temp_conv.cels.value);
var kelvin= Number(document.temp_conv.kelv.value);


function conversion() {
	if(isFinite(fahrenheit)){

		var f= Number(document.temp_conv.fahr.value);
		var c= Number(document.temp_conv.cels.value);
		var k= Number(document.temp_conv.kelv.value);
		var f1= 5/9;
		var s1= f-32;

		var cels= f1*s1
		document.temp_conv.cels.value = cels;
	
		var kelv= cels + 273
		document.temp_conv.kelv.value = kelv;
	}

	else if(isFinite(celsius)){

		var f= Number(document.temp_conv.fahr.value);
		var c= Number(document.temp_conv.cels.value);
		var k= Number(document.temp_conv.kelv.value);

		var fahr= 1.8*c+32
		document.temp_conv.fahr.value = fahr;
	
		var kelv= c + 273
		document.temp_conv.kelv.value = kelv;
	}

	else if(isFinite(kelvin)){

		var f= Number(document.temp_conv.fahr.value);
		var c= Number(document.temp_conv.cels.value);
		var k= Number(document.temp_conv.kelv.value);
	
		var cels= k - 273
		document.temp_conv.kelv.value = kelv;
		
		var fahr= 1.8*cels+32
		document.temp_conv.fahr.value = fahr;
	}
}
 
0
 

You're using the isFinite right. I don't see any problem with it except that if the input is not a number, there won't be a conversion or message to the user.

Remember that when writing a program/script, you should always have your functions do exactly one thing. Here, I modified your conversion() function to execute all the other functions that you have, which allow for checking. Each additional function does their job independently.

KISS (Keep It Simple Stupid) :)

<head>
<script type="text/javascript">
var fahrenheit= Number(document.temp_conv.fahr.value);
var celsius= Number(document.temp_conv.cels.value);
var kelvin= Number(document.temp_conv.kelv.value);

function conversion(){
	//Insert isFinite checking here
	convertFahrenheit();
	//And here
	convertCelsius();
	//And here if you'd like
	convertKelvin();
}

function convertFahrenheit(){
	var f= Number(document.temp_conv.fahr.value);
	var c= Number(document.temp_conv.cels.value);
	var k= Number(document.temp_conv.kelv.value);
	var f1= 5/9;
	var s1= f-32;

	var cels= f1*s1
	document.temp_conv.cels.value = cels;

	var kelv= cels + 273
	document.temp_conv.kelv.value = kelv;
}

function convertCelsius(){
	var f= Number(document.temp_conv.fahr.value);
	var c= Number(document.temp_conv.cels.value);
	var k= Number(document.temp_conv.kelv.value);

	var fahr= 1.8*c+32
	document.temp_conv.fahr.value = fahr;

	var kelv= c + 273
	document.temp_conv.kelv.value = kelv;
}

function convertKelvin(){
	var f= Number(document.temp_conv.fahr.value);
	var c= Number(document.temp_conv.cels.value);
	var k= Number(document.temp_conv.kelv.value);

	var cels= k - 273
	document.temp_conv.kelv.value = kelv;
	
	var fahr= 1.8*cels+32
	document.temp_conv.fahr.value = fahr;
}
</script>

</head>
<body>

<form name="temp_conv">
Fahrenheit<br />
<input type="text" name="fahr" id="fahr" value="" /><br />
Celsius<br />
<input type="text" name="cels" id="cels" value="" /><br />
Kelvin<br />
<input type="text" name="kelv" id="kelv" value="" />
<input type="button" value="Convert" onclick="conversion()" />
</form>

I'm sure you can improve and condense your code further, but that's your job. ;)

 
0
 

Here's a slightly obscure but highly compact way to do it :

function conversion(scale){
	var D = {
		F : { fld:document.temp_conv.fahr, o:['C','K'], fn:function(val){ return (1.8 * val) - 459.4; } },
		C : { fld:document.temp_conv.cels, o:['K','F'], fn:function(val){ return (val - 32) * 5 / 9; } },
		K : { fld:document.temp_conv.kelv, o:['F','C'], fn:function(val){ return val + 273; } }
	};
	D[D[scale].o[0]].fld.value = D[D[scale].o[0]].fn(Number(D[scale].fld.value));
	D[D[scale].o[1]].fld.value = D[D[scale].o[1]].fn(Number(D[D[scale].o[0]].fld.value));
}
function clearIt(){
	document.temp_conv.fahr.value = '';
	document.temp_conv.cels.value = '';
	document.temp_conv.kelv.value = '';
}
<form name="temp_conv">
<table>
<tr>
<td>Fahrenheit</td>
<td><input type="text" name="fahr" id="fahr" value="" /></td>
<td><input type="button" value="Convert" onclick="conversion('F')" /></td>
</tr><tr>
<td>Celsius</td>
<td><input type="text" name="cels" id="cels" value="" /></td>
<td><input type="button" value="Convert" onclick="conversion('C')" /></td>
</tr><tr>
<td>Kelvin</td>
<td><input type="text" name="kelv" id="kelv" value="" /></td>
<td><input type="button" value="Convert" onclick="conversion('K')" /></td>
</tr>
<td colspan="3" align="right"><input type="button" value="Clear" onclick="clearIt()"></td>
</tr><table>
</form>

In case you can't spot how it works, it performs a cyclic conversion, always in the same order but starting at a different point (ie, F->C->K or C->K->F or K->F->C ). This allows each conversion function to be (a) single-faceted and (b) uniquely associated with one scale.

The two 'write' lines in conversion() are a nightmare to follow through. I derived them by progressively refactoring the code into its compact form.

The process could really do with some control over the precision of the conversions in order to force out rounding errors.

Airshow

 
0
 

It's still not working 100% correctly. It's running the conversions for everything, but only for whatever is in the Fahrenheit field. And leaving it blank defaults it to 0.

I'll keep working at it though and see if I can come up with anything.

Thanks for the help

 
0
 

Just wanted to post that I got it working correctly, and show what it looks like.

function convert(){

var f= Number(document.temp_conv.fahr.value);
var c= Number(document.temp_conv.cels.value);
var k= Number(document.temp_conv.kelv.value);

	if (f){ 
		var f1= 5/9;
		var s1= f-32;

		var cels= f1*s1;
		document.temp_conv.cels.value = cels;
 
		var kelv= cels + 273;
		document.temp_conv.kelv.value = kelv;
	}
	
	else if (c){
		var fahr= 1.8*c+32;
		document.temp_conv.fahr.value = fahr;

		var kelv= c + 273;
		document.temp_conv.kelv.value = kelv;
	}
 
 	else if (k){
		var cels= k - 273;
		document.temp_conv.cels.value = cels;
 
		var fahr= 1.8*cels+32;
		document.temp_conv.fahr.value = fahr;
	}
}
Question Answered as of 4 Years Ago by Hoaxygen and Airshow
You
This question has already been solved: Start a new discussion instead
Post:
Start New Discussion
Tags Related to this Article