Ir para conteúdo
Fórum Script Brasil
  • 0

Ocultar <input> Ao Selecionar Num <select>


Beraldo

Pergunta

No sistema que estou fazendo, o usuário deverá marcar um determinado código no <select> ou inserir o código desejado na área de texto. Para evitar que haja o "preenchimento dos dois campos", estou tentando fazer uma função que, quando o usuário marcar um valor em um, desabilita o outro, ou seja, quando houver valor no <select>, desabilitar o <input> e, qunado houver valor no <input>, desabilitar o <select>.

O único problema é a minha pequena experiência com JavaScript. :(

O que fiz até agora é isto (um script para testes):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" language="javascript">
function Ocultar(){
    var ref_select = document.getElementById('ref_select');
    var ref_input = document.getElementById('ref_input');
    
    if (ref_select.options.value == '')
      ref_input.disabled="false";    
        else
          ref_input.disabled="true";
    
    if (ref_input.value == '')
      ref_select.disabled="false";
        else
          ref_select.disabled="true";
}
</script>
<title>Teste</title>
</head>
<body>
<form action="">
<select name="ref" id="ref_select" onchange="Ocultar();">
<option value="">&nbsp;</option>
<option value="teste">Teste</option>
</select>
<br /><br />
<input type="text" name="ref" id="ref_input" onkeyup="Ocultar();" />
</form>
</body>
</html>

Nesse script, quando eu seleciono um valor no <select> ou digito um valor no <input>, ambos os campos ficam desabilitados.

Por que isso está acontecendo? O que estou fazendo de errado?

Valeu

[]'s

Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0

e ai Roberto, é que ele cai tambem no if:

if (ref_input.value == '')

então ele bloqueia os dois, tenta assim:

if (ref_select.options.value != "")
	ref_input.disabled = true;
else
	ref_input.disabled = false;

if (ref_input.value != "")
	ref_select.disabled = true;
else
	ref_select.disabled = false;

Link para o comentário
Compartilhar em outros sites

  • 0

Oi, Andréia.

Agora, ao selecionar "teste" no <select>, desabilita somente o <input>. Até aí, beleza; correto.

Mas, se eu voltar o "teste" para o "", o <input> continua desabilitado. E, se eu digitar algo no <input>, ambos ficam desabilitados.

Resolvi fazer um troço confuso.... cada idéia que tenho... :P

[]'s

Link para o comentário
Compartilhar em outros sites

  • 0

Consegui!!!! :D

Era mais simples do que pudéssemos imaginar.

Apenas precisava-se trocar:

if (ref_select.options.value != "")
por:
if (ref_select.value != "")
O código JS ficou assim, então, para quem precisar:
<script type="text/javascript" language="javascript">
function Ocultar(){
    var ref_select = document.getElementById('ref_select');
    var ref_input = document.getElementById('ref_input');
    
if (ref_select.value != "")
ref_input.disabled = true;
else
ref_input.disabled = false;

if (ref_input.value != "")
ref_select.disabled = true;
else
ref_select.disabled = false;
}
</script>

Valeu

[]'s

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,7k
×
×
  • Criar Novo...