Check box + button disable [RESOLVIDO]

Front-end
#1

JSF 2.0 + prime faces

entao pessoal vou ter um termo para usuario, e nesse caso gostaria de ter um check

Li e aceitos os termos |_| Botao(Disable=true)

ai qdo clicar em no check, o botao fica habilitado(Disable=false).

#2

Javascript.

#3

cara tentei assim e nao foi, da uma ajuda ai

<p:selectBooleanCheckbox id="termo" required="true" onchange="HabiBotao()"/> 
                    
                    <p:commandButton  id="botao" styleClass="botaoEsquerda" type="submit" value="Prosseguir"  
                                      actionListener="#{UserBean.mudarPaginaMenu}" disabled="true"/>
                    
                    <p:commandButton  styleClass="botaoDireita" value="Voltar" type="submit"
                                      actionListener="#{UserBean.mudarPaginaPrescricaoMedica()}"/>

                                          
                    <f:verbatim>
                        <script type="text/javascript">
                            function HabiBotao(){
                                if(document.getElementById('termo').checked == true){
                                    
                                    document.getElementById('botao').disabled = "false"
                                }
                                if(document.getElementById('termo').checked == false){
                                    document.getElementById('botao').disabled = "true"
                                }
                            }
                        </script>
                    </f:verbatim>
#4

Se é jsf, o id do elemento é composto por idDoForm:idDoElemento.
Isso

if(document.getElementById('termo').checked == true){

Não vai funcionar, pois, está pegando apenas o id do elemento.

#5

isso e jsf, msm colocando idform:idElemento, nao funciona!! :S

#6

Posta a xhtml inteira

#7 

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <h:head>
        <title>Termo Responsabilidade</title>
        <link rel="stylesheet" type="text/css" href="css/padrao.css"/>
        <link rel="stylesheet" type="text/css" href="css/04_TermodeResponsabilidade.css"/>
    </h:head>

    <h:body>
        <div class="header">
        </div>

        <h:form id="form1">

            <p:panelGrid columns="1" styleClass="painelPrincipal ui-panelgrid td" >

                <p:panel  style="background-color: #FFF5EE;" >
                    <h1> <p align="center"> Termo de Responsabilidade </p></h1>
                    <br/>
                    <p> Teste de conteúdo.</p>
                    <br/> <br/>
                    <p> Está ciente?!</p>
                </p:panel>

                <p:panel style="border-color: white">

                    <h:outputText value="Li e Aceito o Termos de Responsabilidade: "
                                  style="font-style: italic"/>
                    
                    <p:selectBooleanCheckbox id="termo" required="true" onchange="HabiBotao()"/>   
                      
                    <p:commandButton  id="botao" styleClass="botaoEsquerda" type="submit" value="Prosseguir"    
                                      actionListener="#{UserBean.mudarPaginaMenu}" disabled="true"/>  
                      
                    <p:commandButton  styleClass="botaoDireita" value="Voltar" type="submit"  
                                      actionListener="#{UserBean.mudarPaginaPrescricaoMedica()}"/>  
  
                                            
                    <f:verbatim>  
                        <script type="text/javascript">  
                            function HabiBotao(){  
                                if(document.getElementById('termo').checked == true){  
                                      
                                    document.getElementById('botao').disabled = "false"  
                                }  
                                if(document.getElementById('termo').checked == false){  
                                    document.getElementById('botao').disabled = "true"  
                                }  
                            }  
                        </script>  
                    </f:verbatim> 


                </p:panel> 

            </p:panelGrid>
        </h:form>


    </h:body>
</html>
#8

Cade o value do selectBooleanCheckbox para ele mapear isso com uma propriedade do managedBean ?

Veja com o firebug ou similar se o id do checkbox foi setado e se o seu javascript é chamado.
Se sim veja o valor de document.getElementById(‘botao’)

#9

Pode-se também fazer uma chamada ajax, que ao mudar o check você iria mudar um atributo, o qual daria o disabled no botão ou não.

#10

[quote=lele_vader]Cade o value do selectBooleanCheckbox para ele mapear isso com uma propriedade do managedBean ?

Veja com o firebug ou similar se o id do checkbox foi setado e se o seu javascript é chamado.
Se sim veja o valor de document.getElementById(‘botao’)[/quote]
Isso é desnecessário. A propriedade value não interfere em nada no que ele quer fazer.
O problema está no fato de colocar o script abaixo dos elementos e não no head do html, quando ele clica no checkbox, nenhum evento é disparado, pois o script não é conhecido por todos.

#11

Eu sei que não tem nada a ver isso.
Só questionei por conta de o valor que ele colocar não vai voltar para o server e lá tem um required = true.

#12

Aí vai um exemplo simples.

#13

vlw cara funcionou, mais so um detalhe, ele funciona no firefox, no ie nao funciona… sabe pq??

#14

Não tenho a mínima idéia.
Tente debugar (se usa IE >= 8, com a página aberta pressione a tecla F12 e você terá algo parecido com o firebug).

#15