[Resolvido] Botão de cadastro

adenison · Maio 5, 2010

Boa noite,

Estou desenvolvendo um formulario para cadastro de chamado, porém eu gostaria que o botão de cadastrar só desse para clicar se o checkbox do Termo de contrato foi ticado..

Estou tentando fazer mais nao consigo..

Fiz um modelo simples para teste ..

<!--Validação -->
<HEAD>
<script LANGUAGE="JavaScript">

function Disab(val) {
frm=document.forms[0]
if(val=="enabl")
{frm.Button1.disabled=false}
if(val=="buttn1")
{frm.Button1.disabled=true}
if(val=="disabl")
{frm.Button1.disabled=true}
}

</SCRIPT>
</HEAD>

<!--// Formulario ///-->

<form>
<div align="center">
<input name="termo" type="checkbox" id="termo" />
</div>
<p align="center">
<input type=button onClick="alert('Button 1 pressed!')" value="Button 1" name="Termo">
</form>
</BODY>

Quando ou tico nao acontece nada...

Evandro Oliveira · Maio 5, 2010

<form action="" method="post">
   <fieldset>
       <legend>Cadastro</legend>
       <p><input type="checkbox" id="aceita_termos" /><label for="aceita_termos">Aceito os termos.</label></p>
       <p><button type="submit" id="envia" disabled="disabled">Cadastrar!</button></p>
   </fieldset>
</form>

window.onload = function(){
    document.getElementById('aceita_termos').onchange = function(){
        if(this.checked) document.getElementById('envia').disabled = false;
        else document.getElementById('envia').disabled = true;
    }
}

adenison · Maio 5, 2010

Cara, muito obrigado.

E consegui implantar no meu formlario apenas para pessoa fisica, quando eu seleciono pessoa juridica o botão aparece apagado, mais ao ticar nao acende...

<html>
<head>
<title>ABERTURA DE CHAMADO</title>
    <script type="text/javascript">
function verificaPessoa(){
  if (document.getElementById('tipoPessoa').value == 'PF'){
    document.getElementById('pessoaFisica').style.display='block';
    document.getElementById('pessoaJuridica').style.display='none';
  }else{
    document.getElementById('pessoaFisica').style.display='none';
    document.getElementById('pessoaJuridica').style.display='block';
  }
}

window.onload = function(){
    document.getElementById('aceita_termos').onchange = function(){
        if(this.checked) document.getElementById('submit').disabled = false;
        else document.getElementById('submit').disabled = true;
    }
}
     </script>
</head>
<body>
<fieldset>
<p align="left"><img src="image/topo_home.jpg" width="784" height="112" ></p>
<p align="left"><font size="4">Preencha os dados abaixo:</font></p>
<div class="apenas_quebrar_linha">
<font size="2"><strong><em>Selecione:</em></strong></font>         
  <select id="tipoPessoa" name="tipoPessoa" onChange="verificaPessoa();" >
	<option value="PF">Pessoa Física</option>
    <option value="PJ">Pessoa Jurídica</option>
</select></div>
<div id="pessoaFisica" style="display:block;">
<form id="cadastro" name="cadastro" method="post" action="cadastropf.php">
<br>
<table width="966" height="142">
    <tr> 
     <td><font size="2"><strong><em>Nome:</em></strong></font></td>
     <td><input name="nome" type="text" id="nome" size="70" maxlength="60" value="<?php echo $nome; ?>" > 
        <span class="style1">*</span></td>
    <tr> 
      <td><font size="2"><strong><em>Email:</em></strong></font></td>
      <td><input name="email" type="text" id="email"  size="70" maxlength="60" value="<?php echo $email; ?>"> 
        <span class="style1">*</span></td>
    </tr>
	<tr>
      <td><font size="2"><strong><em>DDD:</em></strong></font></td>
      <td><input name="ddd" type="text" id="ddd" size="4" maxlength="3" value="<?php echo $ddd; ?>" >
      <font size="2"><em><strong>Telefone: 
      <input name="telefone" type="text" id="telefone" size="11" maxlength="8" value="<?php echo $telefone; ?>" >
        <span class="style1">* Apenas números </span></strong></em></font></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">Endereço:</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="endereco" type="text" id="endereco" size="70" maxlength="60"  value="<?php echo $endereco; ?>">
        <span class="style1">*</span></strong></em></font> <em><strong><font size="2">Número</font></strong></em><font size="2"><em><strong> 
        <input name="numero" type="text" id="numero" size="6" maxlength="6" value="<?php echo $numero; ?>">
        <span class="style1">*</span></strong></em></font></td>
    </tr>
	<tr> 
      <td><em><strong><font size="2">Complemento:</font></strong></em></td>
      <td><input name="comp" type="text" id="comp" maxlength="20" /> <font size="2"><strong><em>Bairro:</em></strong></font> 
          <input name="bairro" type="text" id="bairro" maxlength="40" <?php echo $bairro; ?>/> <font size="2"><strong><em>Cep:</em></strong></font>
		  <input name="cep" type="text" id="cep" maxlength="11" <?php echo $numero; ?> /> <span class="style1">*</span></td>
    </tr>
    <tr>
      <td><font size="2"><strong><em>Cidade:</em></strong></font></td>
      <td><input name="cidade" type="text" id="cidade" maxlength="40" value="<?php echo $cidade; ?>">
      <em><strong><font size="2">Estado:</font></strong></em> 
      <select name="uf" id="uf" >
	    <option value="SP">SP</option>
        <option value="AC">AC</option>
        <option value="AL">AL</option>
        <option value="AP">AP</option>
        <option value="AM">AM</option>
        <option value="BA">BA</option>
        <option value="CE">CE</option>
        <option value="ES">ES</option>
        <option value="DF">DF</option>
        <option value="MA">MA</option>
        <option value="MT">MT</option>
        <option value="MS">MS</option>
        <option value="MG">MG</option>
        <option value="PA">PA</option>
        <option value="PB">PB</option>
        <option value="PR">PR</option>
        <option value="PE">PE</option>
        <option value="PI">PI</option>
        <option value="RJ">RJ</option>
        <option value="RN">RN</option>
        <option value="RS">RS</option>
        <option value="RO">RO</option>
        <option value="RR">RR</option>
        <option value="SC">SC</option>
       	<option value="SE">SE</option>
        <option value="TO">TO</option>
      </select>
        <span class="style1"><strong><font size="2"><em>*</em></font></strong></span></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">CPF:</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="cpf" type="text" id="cpf" maxlength="11" value="<?php echo $cpf; ?>">
        <span class="style1">* Apenas números </span> </strong></em></font></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">RG:</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="rg" type="text" id="rg" maxlength="14" value="<?php echo $rg; ?>">
        <span class="style1">* Apenas números</span> </strong></em></font></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">Nota Fiscal</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="nota" type="text" id="nota" size="30" maxlength="9" value="<?php echo $nota; ?>" >
        <span class="style1">*</span> <span class="style3">Apenas números 
        </span> </strong></em></font></td>
    </tr>
	<tr> 
      <td><em><strong><font size="2">Data de Emissão</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="emissao_data" type="text" id="emissao_data" maxlength="8" value="<?php echo $emissao_data; ?>">
        <span class="style1">*</span> <span class="style3">Apenas números 
        - Ex: 01012010</span> </strong></em></font></td>
    </tr>
      <td><em><strong><font size="2">Nº Serie da NF</font></strong></em></td>
    <td><font size="2"><em><strong> 
      <input name="serie" type="text" id="serie" size="30" maxlength="3" value="<?php echo $serie; ?>">
        <span class="style1">*</span> <span class="style3">Apenas números 
        </span> </strong></em></font></td>
		    </tr>
	<tr>
      <td><em><strong><font size="2">Nº Serie da Equipamento:</font></strong></em></td>
    <td><font size="2"><em><strong> 
      <input name="serie2" type="text" id="serie2" size="30" maxlength="20" value="<?php echo $seriequip; ?>">
          </span> </strong></em></font></td>
		    </tr>			
    
  <tr> 
    <td><p align="left"><em><strong>Descrição </strong></em><em><strong>do 
        problema</strong></em></p>
      </td>
      <td><p>
        <textarea name="desc" cols="120" rows="4" id="desc"  maxlength="255" value="<?php echo $relato; ?>" ></textarea>
      </p>
      </td>
    </tr>
    <tr>
    <td width="4%"><div align="right"><font color="#FF0000" size="2"></font>
    <input type="checkbox" id="aceita_termos" /> 
          </div></td>
   <td width="96%"> <div align="left"><strong> Li e aceito os <a href="termo.php" target="_blank">termos
          de cadastro</a> <font color="#FF0000" size="2"><font size="4">*</font></font></strong></div></td>

    </tr>
    <tr> 
      <td colspan="2"><div align="center"><font color="#CC3300"> </font> 
          <input name="submit" type="submit" id="submit" disabled="disabled" value="Cadastrar" />   
          <input name="limpar" type="reset" id="limpar" value="Limpar Campos preenchidos!" />
          <br>
          <span class="style1"><strong><font size="2"><em>* Campos com * são 
          obrigatórios!</em></font></strong> </span></p> </div>
        <p>  </p></td>
    </tr>
	</table>
</div>
</form>
<form id="cadastro" name="cadastro" method="post" action="cadastropj.php" >
<div class="apenas_quebrar_linha">
<div id="pessoaJuridica" style="display:none;">
<br>
<table width="966" height="142">
     <tr> 
      <td width="153"><font size="2"><strong><em>Razão Social:</em></strong></font></td>
     <td width="801"><input name="nome" type="text" id="nome" size="70" maxlength="60" <?php echo $nome; ?>"> 
        <span class="style1">*</span></td>
    </tr>
   <tr> 
      <td><font size="2"><strong><em>Email:</em></strong></font></td>
      <td><input name="email" type="text" id="email" size="70" maxlength="60" <?php echo $email; ?>"> 
        <span class="style1">*</span></td>
    </tr>
	<tr>
      <td><font size="2"><strong><em>DDD:</em></strong></font></td>
      <td><input name="ddd" type="text" id="ddd" size="4" maxlength="3" value="<?php echo $ddd; ?>" >
      <font size="2"><em><strong>Telefone: 
      <input name="telefone" type="text" id="telefone" size="11" maxlength="8" value="<?php echo $telefone; ?>" >
        <span class="style1">* Apenas números </span></strong></em></font></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">Endereço:</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="endereco" type="text" id="endereco" size="70" maxlength="60" <?php echo $endereco; ?>">
        <span class="style1">*</span></strong></em></font>
      <em><strong><font size="2">Numero</font></strong></em><font size="2"><em><strong> 
        <input name="numero" type="text" id="numero" size="6" maxlength="6" <?php echo $numero; ?>" >
        <span class="style1">*</span></strong></em></font></td>
    </tr>
	<tr> 
      <td><em><strong><font size="2">Complemento:</font></strong></em></td>
      <td><input name="comp" type="text" id="comp" maxlength="20" /> <font size="2"><strong><em>Bairro:</em></strong></font> 
          <input name="bairro" type="text" id="bairro" maxlength="40" <?php echo $bairro; ?>/> <font size="2"><strong><em>Cep:</em></strong></font>
		  <input name="cep" type="text" id="cep" maxlength="11" <?php echo $numero; ?> /> <span class="style1">*</span></td>
    </tr>
    <tr>
      <td><font size="2"><strong><em>Cidade:</em></strong></font></td>
      <td><input name="cidade" type="text" id="cidade" maxlength="20"value="<?php echo $cidade; ?>" >
      <em><strong><font size="2">Estado:</font></strong></em> 
      <select name="uf" id="uf" >
	    <option value="SP">SP</option>
        <option value="AC">AC</option>
        <option value="AL">AL</option>
        <option value="AP">AP</option>
        <option value="AM">AM</option>
        <option value="BA">BA</option>
        <option value="CE">CE</option>
        <option value="ES">ES</option>
        <option value="DF">DF</option>
        <option value="MA">MA</option>
        <option value="MT">MT</option>
        <option value="MS">MS</option>
        <option value="MG">MG</option>
        <option value="PA">PA</option>
        <option value="PB">PB</option>
        <option value="PR">PR</option>
        <option value="PE">PE</option>
        <option value="PI">PI</option>
        <option value="RJ">RJ</option>
        <option value="RN">RN</option>
        <option value="RS">RS</option>
        <option value="RO">RO</option>
        <option value="RR">RR</option>
        <option value="SC">SC</option>
       	<option value="SE">SE</option>
        <option value="TO">TO</option>
      </select>
        <span class="style1">*</span></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">CNPJ:</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="cnpj" type="text" id="cnpj" maxlength="14" value="<?php echo $cnpj; ?>">
        <span class="style1">* Apenas números </span> 
        </strong></em></font></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">I.E:</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="ie" type="text" id="ie" maxlength="20" value="<?php echo $ie; ?>">
        <span class="style1">* Apenas números</span> 
        </strong></em></font></td>
    </tr>
    <tr> 
      <td><em><strong><font size="2">Nota Fiscal</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="nota" type="text" id="nota" size="30" maxlength="9" value="<?php echo $nota; ?>">
        <span class="style1">*</span> <span class="style3">Apenas números 
        </span> </strong></em></font></td>
    </tr>
	<tr> 
      <td><em><strong><font size="2">Data de Emissão</font></strong></em></td>
      <td><font size="2"><em><strong> 
        <input name="emissao_data" type="text" id="emissao_data" maxlength="8" value="<?php echo $emissao_data; ?>" >
        <span class="style1">*</span> <span class="style3">Apenas números 
        - Ex: 01012010</span> </strong></em></font></td>
    </tr>
    <td><em><strong><font size="2">Nº Serie da NF</font></strong></em></td>
    <td><font size="2"><em><strong> 
      <input name="serie" type="text" id="serie" size="30" maxlength="3" value="<?php echo $serie; ?>" >
      <span class="style1">*</span> <span class="style3">Apenas números 
        </span> </strong></em></font></td>
		    </tr>
    <tr>
      <td><em><strong><font size="2">Nº Serie da Equipamento:</font></strong></em></td>
    <td><font size="2"><em><strong> 
      <input name="serie2" type="text" id="serie2" size="30" maxlength="20" value="<?php echo $seriequip; ?>">
          </span> </strong></em></font></td>
		    </tr>
  <tr> 
    <td><p align="left"><em><strong>Descrição </strong></em><em><strong>do 
        problema</strong></em></p>
      </td>
      <td><p>
        <textarea name="desc" cols="120" rows="4" id="desc"  maxlength="255" value="<?php echo $relato; ?>" ></textarea>
      </p>
      </td>
    </tr>
	<tr>
    <td width="4%"><div align="right"><font color="#FF0000" size="2"></font>
    <input type="checkbox" id="aceita_termos" /> 
          </div></td>
   <td width="96%"> <div align="left"><strong> Li e aceito os <a href="termo.php" target="_blank">termos
          de cadastro</a> <font color="#FF0000" size="2"><font size="4">*</font></font></strong></div></td>

    </tr>
<tr> 
      <td colspan="2"><div align="center"><font color="#CC3300"> </font> 
          <input name="submit" type="submit" id="submit" disabled="disabled" value="Cadastrar" />   
          <input name="limpar" type="reset" id="limpar" value="Limpar Campos preenchidos!" />
          <br>
          <span class="style1"><strong><font size="2"><em>* Campos com * são 
          obrigatórios!</em></font></strong> </span></p> </div>
        <p>  </p></td>
    </tr>
	</table>
 </div> 
</form>

</fieldset>
</body>
</html>

Esse é meu formulário...

adenison · Maio 6, 2010

Será que eu não preciso criar na função uma condição para a pessoa juridica também?

Só falta isso pra finalizar esse formulario.. :(

Evandro Oliveira · Maio 6, 2010

primeiro uma atualizaçãozinha:

antes

window.onload = function(){
    document.getElementById('aceita_termos').onchange = function(){
        if(this.checked) document.getElementById('envia').disabled = false;
        else document.getElementById('envia').disabled = true;
    }
}

depois

window.onload = function(){
    document.getElementById('aceita_termos').onchange = function(){
        document.getElementById('envia').disabled = !(this.checked);
    }
}

agora note, que temos dois elementos variáveis:

- aceita_termos

- envia

eles apontam respectivamente para a caixa que recebe o tique e o botão de envio de formulário.

Note, você tem dois formulários, duas caixas e dois botões. Nada mais justo que também ter duas funções.

vamos mudar o nome de aceita_termos e envia para aceita_termos_fisica e envia_fisica respecivamente

...<input type="checkbox" id="aceita_termos_fisica" />...
<button type="submit" id="envia_fisica" disabled="disabled">Cadastrar</button> ...

no próximo formulário, teremos a mesma estrutura, agora para pessoas juridicas

...<input type="checkbox" id="aceita_termos_juridica" />...
<button type="submit" id="envia_juridica" disabled="disabled">Cadastrar</button> ...

e agora, a criação da segunda função (e atualização da primeira):

window.onload = function(){
    document.getElementById('aceita_termos_fisica').onchange = function(){
        document.getElementById('envia_fisica').disabled = !(this.checked);
    }
    document.getElementById('aceita_termos_juridica').onchange = function(){
        document.getElementById('envia_juridica').disabled = !(this.checked);
    }
}

adenison · Maio 6, 2010

Evandro,

Valeu mesmo pela ajuda cara... conseguir fazer rodar, mais apenas no firefox e no chrome..

Quando abro a pagina no ie.. e clico no checkbox ele so ativa o botaão seu der der outro clique fora do check box.

Veja o q estou falando..

http://polos.t35.com/Teste/PHP/formulario.php

Valeu

Evandro Oliveira · Maio 6, 2010

troque onchange por onclick

adenison · Maio 6, 2010

Cara, você é do mal.. kkkkk

Funcionou perfeitamente..

Valeu..

Conhece uma livro bom pra me indica?

Evandro Oliveira · Maio 6, 2010

http://oreilly.com/catalog/9781565923928

Os livros da O'Reilly são simplesmente fabulosos (aqui no meu trabalho tem todos relacionados ao desenvolvimento Web)

Se preferir algo nacional, procure pelos livros do Maujor

Thiago Retondar · Maio 6, 2010

Os livros do O'Reilly são excelentes mesmo! Tenho o JavaScript - O Guia Definitivo e a explicação que é dada no livro é show!

Se comprar, não vai se arrepender.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Arquivado

[Resolvido] Botão de cadastro

Recommended Posts

adenison 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

adenison 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

adenison 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

adenison 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

adenison 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

Thiago Retondar 18

Compartilhar este post

Link para o post

Compartilhar em outros sites

Estou criando uma calculadora de m2 e litros de tinta

Cruzamento de Bases

Consulta sem duplicação

Fóruns

Tempo Real

Informação importante