Radiobox para desabilitar combobox?

20 de maio de 2011 12 respostas

juniorsatanas 20 de maio de 2011

Pessoal tenho dois tipo de clientes no meu sistema Fisico e Juridico, esses clientes são listados em um combobox, na hora de fazer um cadastro tenho que escolher que tipo de cliente eu vou usar Fisico ou juridico, para o usuário não selecionar as 2 opções criei um radio para abilitar a opção desejada assim :
[img]https://lh3.googleusercontent.com/_nTzBoYSeT2I/TdakTQrDojI/AAAAAAAAEqY/e5qz6TobqCQ/s1152/tela.png[/img]
[url]https://lh3.googleusercontent.com/_nTzBoYSeT2I/TdakTQrDojI/AAAAAAAAEqY/e5qz6TobqCQ/s1152/tela.png[/url]

segue o cogio :

&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
        &lt;title&gt;sigi&lt;/title&gt;
        &lt;!-- jQuery --&gt;
        &lt;script type="text/javascript" src="&lt;c:url value='/js/jquery-1.4.js'/&gt;"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;

            function check(id){
                document.getElementById(id).enabled;
            }
            function dcheck(id){
                document.getElementById(id).enabled;
            }
        &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;form&gt;
        <br>&lt;input type=radio name=fisica value=fisica&gt;Cliente Fisica
        <br>&lt;input type=radio name=juridica value=juridica&gt;Cliente Juridica
        &lt;/form&gt;
        &lt;form id="testecheckbox"&gt;
            &lt;select name="fisico"  disabled&gt;
                &lt;option value="-2" selected&gt;Selecione cliente Fisico&lt;/option&gt;
                &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                &lt;option value="3"&gt;Escola 3&lt;/option&gt;
            &lt;/select&gt;
            <p>
                &lt;select name="juridico"  disabled&gt;
                    &lt;option value="-2" selected&gt;Selecione cliente Juridico&lt;/option&gt;
                    &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                    &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                    &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                    &lt;option value="3"&gt;Escola 3&lt;/option&gt;
                &lt;/select&gt;
        &lt;/form&gt;
    &lt;/body&gt;
&lt;/html&gt;

Só que não funciona alguém sabe fazer isso ? obrigado desde já !

12 Respostas

wender.jean 20 de mai. de 2011

Uma possivel solução, se entendi bem.

<html>   
    <head>   
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">   
        <title>sigi</title>   
        <!-- jQuery -->   
        <script type="text/javascript" src="<c:url value='/js/jquery-1.4.js'/>"></script>   
        <script type="text/javascript">   
  
            function check(element){   
        	if(element.value == "f") {
			document.getElementById('fisico').disabled = false;
			document.getElementById('juridico').disabled = true;
		}
		if(element.value == "j") {
			document.getElementById('juridico').disabled = false;
			document.getElementById('fisico').disabled = true;
		}
            }    
        </script>   
    </head>   
    <body>   
        <form>   
        <br><input type=radio name=selPessoa value=f onclick="check(this)">Cliente Fisica   
        <br><input type=radio name=selPessoa value=j onclick="check(this)">Cliente Juridica   
        </form>   
        <form id="testecheckbox">   
            <select id="fisico" disabled>   
                <option value="-2" selected>Selecione cliente Fisico</option>   
                <option value="-1">-------------------------</option>   
                <option value="1">Escola 1</option>   
                <option value="2">Escola 2</option>   
                <option value="3">Escola 3</option>   
            </select>   
            <p>   
                <select id="juridico"  disabled>   
                    <option value="-2" selected>Selecione cliente Juridico</option>   
                    <option value="-1">-------------------------</option>   
                    <option value="1">Escola 1</option>   
                    <option value="2">Escola 2</option>   
                    <option value="3">Escola 3</option>   
                </select>   
        </form>   
    </body>   
</html>

kritiuns 20 de mai. de 2011

<form>  
        <br><input type="radio" name="radio" id="radio_" value="fisica" onClick="javascript: metodoHabilitaFisica()" >Cliente Fisica  
        <br><input type="radio" name="radio" id="radio_" value="juridica" onClick="javascript: metodoHabilitaJuridica()"  >Cliente Juridica  
        </form>

o javascript

function metodoHabilitaFisico(){  
                document.getElementById('fisico').disabled = false; 
                document.getElementById('juridico').disabled = true; 
            } 

            function metodoHabilitaJuridico(){  
                document.getElementById('juridico').disabled = false;  
                document.getElementById('fisico').disabled = true; 
            }

adicione a property id nos 2 selects também…

acho q já resolve seu problema …Abraço

[EDIT]
Desculpa wender.jean não tinha visto seu POST

juniorsatanas 20 de mai. de 2011

&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
        &lt;title&gt;sigi&lt;/title&gt;
        &lt;!-- jQuery --&gt;
        &lt;script type="text/javascript" src="&lt;c:url value='/js/jquery-1.4.js'/&gt;"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;
            function habilitaFisico(){
                document.getElementById('fisico').enabled;
                document.getElementById('juridico').disabled;
            }

            function habilitaJuridico(){
                document.getElementById('fjuridico').enabled;
                document.getElementById('fisico').disabled;
            }
        &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;form&gt;
            <br>&lt;input type="radio" name="radio" id="radio_" value="fisica" onClick="javascript: metodoHabilitaFisica()" &gt;Cliente Fisica
            <br>&lt;input type="radio" name="radio" id="radio_" value="juridica" onClick="javascript: metodoHabilitaJuridica()"  &gt;Cliente Juridica
        &lt;/form&gt;
        &lt;form id="testecheckbox"&gt;
            &lt;select name="fisico"  disabled&gt;
                &lt;option value="-2" selected&gt;Selecione cliente Fisico&lt;/option&gt;
                &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                &lt;option value="3"&gt;Escola 3&lt;/option&gt;
            &lt;/select&gt;
            <p>
                &lt;select name="juridico"  disabled&gt;
                    &lt;option value="-2" selected&gt;Selecione cliente Juridico&lt;/option&gt;
                    &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                    &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                    &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                    &lt;option value="3"&gt;Escola 3&lt;/option&gt;
                &lt;/select&gt;
        &lt;/form&gt;
    &lt;/body&gt;
&lt;/html&gt;

fiz das duas maneiras que os colegas falaram mas não pegou ! o que seria ?

aBraço. e OBrigado aos dois !

juniorsatanas 20 de mai. de 2011

wender.jean Da sua maneira não deu certo, apesar de eu achar que ta tudo certo !

Valeu !

Kanin_Dragon 20 de mai. de 2011

Jovem,

Vejo que seus conhecimentos são mínimos em web, sugiro que você começa estudando JavaScript.

Abs,

juniorsatanas 20 de mai. de 2011

Kanin Dragon Ajudou muito !

Obrigado.

juniorsatanas 20 de mai. de 2011

Obrigado a todos colegas.

Resolvi assim :

&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
        &lt;title&gt;sigi&lt;/title&gt;
        &lt;!-- jQuery --&gt;
        &lt;script type="text/javascript" src="&lt;c:url value='/js/jquery-1.4.js'/&gt;"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;

            function Inibe() {
                document.formulario.T1.disabled = true;
                document.formulario.T2.disabled = false;
            }

            function Exibe() {
                document.formulario.T1.disabled = false;
                document.formulario.T2.disabled = true;
            }

        &lt;/script&gt;

&lt;/head&gt;
&lt;body onload="Inibe()"&gt;
    &lt;form name="formulario"&gt;

        &lt;select size="1" name="T1"&gt;
                &lt;option value="-2" selected&gt;Selecione cliente Juridico&lt;/option&gt;
                    &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                    &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                    &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                    &lt;option value="3"&gt;Escola 3&lt;/option&gt;
            &lt;/select&gt;
        &lt;select size="1" name="T2"&gt;
                &lt;option value="-2" selected&gt;Selecione cliente Juridico&lt;/option&gt;
                    &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                    &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                    &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                    &lt;option value="3"&gt;Escola 3&lt;/option&gt;
            &lt;/select&gt;
            
            &lt;input type="radio" name="a" onClick="Exibe()" value="1"&gt;Habilita
           &lt;input type="radio" name="a" onClick="Inibe()" value="2" checked&gt;Desabilita
    &lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;

kritiuns 23 de mai. de 2011

vc não conseguiu com o jeito q eu mandei pq não adiciono a property id nas radio… como o amigo Kanin Dragon disse vc realmente precisa estuda muito javascript.

juniorsatanas 25 de mai. de 2011

Tentei fazer do modo como você sugeriu :

&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
        &lt;title&gt;http://wbotelhos.wordpress.com&lt;/title&gt;
        &lt;!-- jQuery --&gt;
        &lt;script type="text/javascript" src="&lt;c:url value='/js/jquery-1.4.js'/&gt;"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;

            function habilitaFisico(){
                document.getElementById('fisico').enabled;
                document.getElementById('juridico').disabled;
            }

            function habilitaJuridico(){
                document.getElementById('juridico').enabled;
                document.getElementById('fisico').disabled;
            }
        &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;


        &lt;form&gt;
            <br>&lt;input type="radio" name="radio" id="fisico" value="fisico" onClick="javascript: habilitaFisico()" &gt;Cliente Fisico
            <br>&lt;input type="radio" name="radio" id="juridico" value="juridico" onClick="javascript: habilitaJuridico()"  &gt;Cliente Juridico
        &lt;/form&gt;
        &lt;form id="formulario"&gt;
            &lt;select name="fisico"  id="fisico" &gt;
                &lt;option value="-2" selected&gt;Selecione cliente Fisico&lt;/option&gt;
                &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                &lt;option value="3"&gt;Escola 3&lt;/option&gt;
            &lt;/select&gt;
            <p>
                &lt;select name="juridico" id="juridico"&gt;
                    &lt;option value="-2" selected&gt;Selecione cliente Juridico&lt;/option&gt;
                    &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                    &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                    &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                    &lt;option value="3"&gt;Escola 3&lt;/option&gt;
                &lt;/select&gt;
        &lt;/form&gt;

    &lt;/body&gt;
&lt;/html&gt;

Não funcionou !

juniorsatanas 25 de mai. de 2011

Assim Funciona pelo ID :

&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
        &lt;title&gt;http://wbotelhos.wordpress.com&lt;/title&gt;
        &lt;!-- jQuery --&gt;
        &lt;script type="text/javascript" src="&lt;c:url value='/js/jquery-1.4.js'/&gt;"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;
             function Inibe() {
                 document.formulario.TX.disabled = true;
                 document.formulario.TY.disabled = false;
             }

             function Exibe() {
                 document.formulario.TX.disabled = false;
                 document.formulario.TY.disabled = true;
             }

         &lt;/script&gt;
    &lt;/head&gt;
 
     &lt;body onload="Inibe()"&gt;
     &lt;form name="formulario"&gt;

         &lt;select size="1" name="T1" id="TX"&gt;
                 &lt;option value="-2" selected&gt;Selecione cliente Juridico&lt;/option&gt;
                     &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                     &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                     &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                     &lt;option value="3"&gt;Escola 3&lt;/option&gt;
             &lt;/select&gt;
         &lt;select size="1" name="T2" id="TY"&gt;
                 &lt;option value="-2" selected&gt;Selecione cliente Juridico&lt;/option&gt;
                     &lt;option value="-1"&gt;-------------------------&lt;/option&gt;
                     &lt;option value="1"&gt;Escola 1&lt;/option&gt;
                     &lt;option value="2"&gt;Escola 2&lt;/option&gt;
                     &lt;option value="3"&gt;Escola 3&lt;/option&gt;
             &lt;/select&gt;

             &lt;input type="radio" name="a" onClick="Exibe()" value="1"&gt;Habilita
            &lt;input type="radio" name="a" onClick="Inibe()" value="2" checked&gt;Desabilita
     &lt;/form&gt;
 &lt;/body&gt;
&lt;/html&gt;

kritiuns 25 de mai. de 2011

Não foi assim q falei pra vc fazer …

os radios

<form>  
            <br><input type="radio" name="radio" id="radio" value="fisico" onClick="javascript: habilitaFisico()" >Cliente Fisico  
            <br><input type="radio" name="radio" id="radio" value="juridico" onClick="javascript: habilitaJuridico()"  >Cliente Juridico  
        </form>

Os selects

<select name="fisico"  id="fisico" >  
                <option value="-2" selected>Selecione cliente Fisico</option>  
                <option value="-1">-------------------------</option>  
                <option value="1">Escola 1</option>  
                <option value="2">Escola 2</option>  
                <option value="3">Escola 3</option>  
            </select>  
            <p>  
                <select name="juridico" id="juridico">  
                    <option value="-2" selected>Selecione cliente Juridico</option>  
                    <option value="-1">-------------------------</option>  
                    <option value="1">Escola 1</option>  
                    <option value="2">Escola 2</option>  
                    <option value="3">Escola 3</option>  
                </select>

o Javascript

function habilitaFisico(){  
                document.getElementById('fisico').disabled = false;  
                document.getElementById('juridico').disabled = true;  
            }  
  
            function habilitaJuridico(){  
                document.getElementById('juridico').disabled = false;  
                document.getElementById('fisico').disabled = true;  
            }

vc estava usando 2 componentes do html com o mesmo ID … deixando o javascript confuso hehe … sem contar no modo que estava deixando disabled e enable …

ai está o código… só para documentar …

juniorsatanas 25 de mai. de 2011

Uma coisa que percebi foi o “<body onload=“Inibe()”>” !

Obrigado mano Boa Semana para Você !

Criado 20 de maio de 2011

Ultima resposta 25 de mai. de 2011

Respostas 12

Participantes 4

12 Respostas

Topicos relacionados