[Resolvido] Problema com Radio Button

Arapuá · Janeiro 17, 2011

Olá. Estou tentando fazer uma página pra conversão de temperatura. É só pra aprendizado.

<head>
<script type = "text/javascript" src = "funoesjs.js">		
</script>
<script type = "text/javascript">
function converteTemperatura(valor)
	{
	i = 0;
	b = false;
	while(b == false)
		{
		if(f1.rd1[i].checked)
			{
			b = true;
			}
			else
			{
			i++;
			}
		}
	switch (i)
		{
		case 0: return(celToFah(valor).toFixed(2)+" ºF");break;
		case 1: return(celToKel(valor).toFixed(2)+" ºK");break;
		case 2: return(fahToCel(valor).toFixed(2)+" ºC");break;
		case 3: return(fahToKel(valor).toFixed(2)+" ºK");break;
		case 4: return(kelToCel(valor).toFixed(2)+" ºC");break;
		case 5: return(kelToFah(valor).toFixed(2)+" ºF");break;
		}
	}
</script>	
</head>

O problema é que ao selecionar o case 1 dá erro. É só esse que dá erro! f1 é o nome do formulário e rd1 é o nome do radio button.

O arquivo "funoesjs.js" tem as funções:

function celToFah(valor)
	{
	valConvertido = valor * 1.8 + 32;
	return(valConvertido);
	}
function fahToCel(valor)
	{
	valConvertido = (valor - 32)/1.8;
	return(valConvertido);
	}
function kelToFah(valor)
	{
	valConvertido = valor * 1.8 - 459.67;
	return(valConvertido);
	}	
function kelToCel(valor)
	{
	valConvertido = valor - 273.15;
	return(valConvertido);
	}	
function celToKel(valor)
	{
	valConvertido = valor + 273.15;
	return(valConvertido);
	}	
function fahToKel(valor)
	{
	valConvertido = (valor + 459.67)*(5/9);
	return(valConvertido);
	}

Por favor, se alguem puder me mostrar o q tô fazendo de errado.

Valew.

William Bruno · Janeiro 17, 2011

não use a forma:

form.input

prefira o padrão:

document.getElementById( 'id_do_input' )

se tiver dúvidas, poste o html do formulario

Arapuá · Janeiro 17, 2011

Mudei assim:

<script type = "text/javascript">
function converteTemperatura()
{
valor = document.getElementById("valorGrau").value;			
b = false;
while(b == false)
	{
	if(document.getElementById("rd1")[i].checked)
		{
		b = true;
		}
	else
		{
		i++;
		}
	}
switch (i)
	{
	case 0: return(celToFah(valor).toFixed(2)+" ºF");break;
	case 1: return(celToKel(valor).toFixed(2)+" ºK");break;
	case 2: return(fahToCel(valor).toFixed(2)+" ºC");break;
	case 3: return(fahToKel(valor).toFixed(2)+" ºK");break;
	case 4: return(kelToCel(valor).toFixed(2)+" ºC");break;
	case 5: return(kelToFah(valor).toFixed(2)+" ºF");break;
	}				
}
</script>

E o html ficou assim:

<form id = f1>
<input type = "text" id = "valorGrau" value = "0">
<br>
<br><input type = "radio" id = "rd1" checked> Celsius para Fahrenheit
<br><input type = "radio" id = "rd1"> Celsius para Kelvin
<br><input type = "radio" id = "rd1"> Fahrenheit para Celsius
<br><input type = "radio" id = "rd1"> Fahrenheit para Kelvin
<br><input type = "radio" id = "rd1"> Kelvin para Celsius
<br><input type = "radio" id = "rd1"> Kelvin para Fahrenheit
<br>
<br><input type = "button" value = "CONVERTER" OnClick = alert(converteTemperatura())>
</form>

O problema deve estar em como usar o getElementByID com o radio.

William Bruno · Janeiro 17, 2011

ID não deve se repetir

junte o =

type="radio" id="rd1"

você pode fazer mais simples:

 if(document.getElementById('este_dispara').checked)

e então:

colocar esse 'id' diferenciado apenas no radio que vai fazer essa 'diferenciação'.

Arapuá · Janeiro 17, 2011

Obrigado pelas dicas. Se faço assim, veja como está comentado:

i = 1;  // só não funciona se for i = 1, para o resto funciona tudo!!!
switch (i)
{
case 0: return(celToFah(valor).toFixed(2)+" ºF");break;
case 1: return(celToKel(valor).toFixed(2)+" ºK");break;    //--> Essa linha não funciona!
//case 1: return(celToKel(50).toFixed(2)+" ºK");break;  //--> Essa linha funciona!
case 2: return(fahToCel(valor).toFixed(2)+" ºC");break;
case 3: return(fahToKel(valor).toFixed(2)+" ºK");break;
case 4: return(kelToCel(valor).toFixed(2)+" ºC");break;
case 5: return(kelToFah(valor).toFixed(2)+" ºF");break;
}:

A mensagem de erro no navegador é:

O Objeto não dá suporte para a propriedade ou método.

Usando só if e else dá pra fazer, mas como estou tentando aprender, eu gostaria de saber oque está errado.

William Bruno · Janeiro 17, 2011

esquece o ie

abre no Firefox, e aperte Ctr+Shif+J

vai te aparecer um debug muito melhor.

faz assim, e veja se o valor está chegando corretamente

case 1: alert( valor); return(celToKel(valor).toFixed(2)+" ºK");break;

veja se o alert te dá o valor correto.

Arapuá · Janeiro 17, 2011

O problema está em ".toFixed(2)".

case 1: return(celToKel(valor)+"  ºF");break; //-->FUNCIONA
case 1: return(celToKel(valor).toFixed(2)+"  ºF");break; //-->NÃO FUNCIONA

No firefox não funcionou e nem apresentou nenhuma mensagem de erro.

William Bruno · Janeiro 17, 2011

ai eu precisaria conhecer ao menos o retorno da função celToKel()

se você apertar Ctrl+Shif+J no Firefox, vão aparecer várias mensagens de erro.. com certeza ^_^

se tiver duvidas, isole isso.

E poste todos os códigos js pertinentes e o HTML, ai eu rodo aqui.

Arapuá · Janeiro 17, 2011

HTML:

<html>
<head>
	<script type = "text/javascript" src = "funoesjs.js">		
	</script>
	<script type = "text/javascript">
	function converteTemperatura()
		{
		valor = document.getElementById("valorGrau").value;			
		b = false;
		i = 1;
		/*while(b == false)
			{
			if(document.getElementById("rd1").checked)
				{
				b = true;
				}
				else
				{
				i++;
				}
			}*/
		switch (i)
			{
			case 0: return(celToFah(valor).toFixed(2)+" ºF");break;
			case 1: return(celToKel(valor).toFixed(2)+" ºK");break;
			case 2: return(fahToCel(valor).toFixed(2)+" ºC");break;
			case 3: return(fahToKel(valor).toFixed(2)+" ºK");break;
			case 4: return(kelToCel(valor).toFixed(2)+" ºC");break;
			case 5: return(kelToFah(valor).toFixed(2)+" ºF");break;
			}				
		}
	</script>	
</head>
<body>
	<h1>	
	Conversor de Valores de Temperatura.
	</h1>
	<hr>
	<h2>
	Digite um valor e escolha uma das opções abaixo:
	</h2><br><br>
	<form id = f1>
		<input type="text" id="valorGrau" value="50">
		<br>
		<br><input type="radio" id="rd1"> Celsius para Fahrenheit
		<br><input type="radio" id="rd2" checked> Celsius para Kelvin
		<br><input type="radio" id="rd3"> Fahrenheit para Celsius
		<br><input type="radio" id="rd4"> Fahrenheit para Kelvin
		<br><input type="radio" id="rd5"> Kelvin para Celsius
		<br><input type="radio" id="rd6"> Kelvin para Fahrenheit
		<br>
		<br><input type="button" value="CONVERTER" OnClick=alert(converteTemperatura())>
	</form>
</body>
</html>

O arquivo .js:

function celToFah(valor)
	{
	valConvertido = valor * 1.8 + 32;
	return(valConvertido);
	}
function fahToCel(valor)
	{
	valConvertido = (valor - 32)/1.8;
	return(valConvertido);
	}
function kelToFah(valor)
	{
	valConvertido = valor * 1.8 - 459.67;
	return(valConvertido);
	}	
function kelToCel(valor)
	{
	valConvertido = valor - 273.15;
	return(valConvertido);
	}	
function celToKel(valor)
	{
	valConvertido = valor + 273.15;
	return(valConvertido);
	}	
function fahToKel(valor)
	{
	valConvertido = (valor + 459.67)*(5/9);
	return(valConvertido);
	}

No firefox diz que fahToKel não é função.

William Bruno · Janeiro 17, 2011

o teu retorno não está sendo um Number, por isso o js não consegue te retornar corretamente

veja:

http://www.w3schools.com/jsref/jsref_tofixed.asp

dei uma corrigida na indentação, e algumas outras coisinhas mais.. veja como ficou:

<html>
<head>
<script type="text/javascript">
function celToFah(valor){
	return valor * 1.8 + 32;
}
function fahToCel(valor){
	return (valor - 32)/1.8;
}
function kelToFah(valor){
	return valor * 1.8 - 459.67;
}       
function kelToCel(valor){
	return valor - 273.15;
}       
function celToKel(valor){
	return valor + 273.15;
}       
function fahToKel(valor){
	return (valor + 459.67)*(5/9);
}
function converteTemperatura()
{
	valor = document.getElementById("valorGrau").value;
	i = 1;

	switch( i )
	{
		case 1: 
			var convertido = new Number( celToKel(valor) );
			return convertido.toFixed(2)+" ºK"; 
			break;
	}
}
</script>
</head>
<body>
<h1>Conversor de Valores de Temperatura.</h1>

<hr />
<h2>Digite um valor e escolha uma das opções abaixo:</h2>
<br /><br />
<form id="f1">
	<input type="text" id="valorGrau" value="50">
	<br />
	<br /><input type="radio" name="temp" id="rd1" /> Celsius para Fahrenheit
	<br /><input type="radio" name="temp" id="rd2" checked="checked" /> Celsius para Kelvin
	<br /><input type="radio" name="temp" id="rd3" /> Fahrenheit para Celsius
	<br /><input type="radio" name="temp" id="rd4" /> Fahrenheit para Kelvin
	<br /><input type="radio" name="temp" id="rd5" /> Kelvin para Celsius
	<br /><input type="radio" name="temp" id="rd6" /> Kelvin para Fahrenheit
	<br />
	<br /><input type="button" value="CONVERTER" onclick="alert( converteTemperatura() );" />
</form>
</body>
</html>

Arapuá · Janeiro 17, 2011

Valeu. Agora funcionou!

Obrigado pelas dicas de identação.

Arquivado

[Resolvido] Problema com Radio Button

Recommended Posts

Arapuá 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

Arapuá 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

Arapuá 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

Arapuá 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

Arapuá 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

Arapuá 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante