Help with Calculators

This site is best viewed in a modern browser with JavaScript enabled.

skb

I run a site/forum for Diabetes help. We've developed a Calculators block that helps convert Blood Sugar readings from one unit to another.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Diabetes Calculators</title>
<style>
p, label {
	font-weight: normal;
	display: block;
}
.sugar {
	color: #00557F;
}
.a1c {
	color: #AE0B1B;
}
.temperature {
	color:  #BA3114;
}
</style>
</head>
<body>
<div class="sugar">
<p>Blood Sugar</p>
<label><input id="c" onkeyup="convert(this,f)"size="8">&nbsp; mmol/l</label>
equals
<label><input id="f" onkeyup="convert(this,c)"size="8">&nbsp; mg/dl</label>
</div>

<div class="a1c">
<p>A1c to Avg. BG</p>
<label><input id="a" onkeyup="convert(this,s)" size="8">&nbsp; A1c</label>
equals
<label><input id="s" onkeyup="convert(this,a)"size="8">&nbsp; Est Avg BG</label>
</div>

<div class="temperature">
<p>Temperature</p>
<label><input id="x" onkeyup="convert(this,y)"size="8">&nbsp;<sup>o</sup> C</label>
equals
<label><input id="y" onkeyup="convert(this,x)"size="8">&nbsp;<sup>o</sup> F</label>
</div>

<script>
function convert(el,answer) {
    switch (el.id) {
     case 'c':
        answer.value = (el.value * 18.05).toFixed(2);
	break;
     case 'f':
        answer.value = (el.value / 18.05).toFixed(2);
	break;
     case 'a':
        answer.value = ((el.value * 35.6) - 77.3).toFixed(2);
	break;
     case 's':
        answer.value = (((el.value * 1) + 77.3) / 35.6).toFixed(2);
	break;
     case ‘x’:
	answer.value = ((el.value * 1.8) + 32) .toFixed(2);
	break;
    case ‘y’ :
	answer.value = (((el.value * 1) -32) / 1.8) .toFixed(2);
	break;
    }
}
</script>

</body>
</html>

The top 2 calculators work fine (when only the 2 are used)
As soon as the Temperature calculator is added all of them stop working. What am I doing wrong ?

root

I see
1. form inputs but no form
2. use of variables that are not defined
3. missing attributes on elements like name and value tags
4. script in the body not the head... generally speaking, code, unless for some reason for it, code should be placed within the head tag.
5. the error I get upon looking closer, I see the use of a character that is not a single quote, the main reason for using the " double quotes in a string is its not missed like a ' single quote or mistaken like this ‘ ’ as single quotes.
6. Remember DRY in all code, DRY = Dont Repeat Yourself, you have the possible use of a function to do repeated types of calculation...

function temp( scale , temp ){
  try{
	switch( scale.toLowerCase() ){
		case "c2f":
			return ( 9 / 5 ) * temp + 32;
		break;

	case "f2c":
		return  ( temp - 32 ) / ( 9 / 5 );	
	break;

	default:
		return temp;
}
  }catch(e){ console.log("Error message: \r\n\t%s",e); }
}


function convert( el ){
...
... other code here
...

 case "x":
answer.value = temp( "c2f", el.value ) .toFixed(2);
break;
case "y":
answer.value = temp( "f2c", el.value ) .toFixed(2);
break;
}
}

The try..catch clause is to prevent divide by zero errors from happening.
and you could put in the missing bits... Its tidy code then

I tested the temperature with -17.7777777777777 deg C and got 0 deg F. which is close enough I think.

So from this you should be able to update your code and correct the errors in the switch..case block.

skb

Thanks. Will implement and revert.