Jump to content
Sign in to follow this  
NadoLoko

Problemas na validação de formulário

Recommended Posts

Galera preciso de ajuda!

Tenho uma pagina de cadastro com um cabeçalho, logo abaixo tenho três <div> de iguais tamanhos, sendo que a primeira fica visível com algumas informações. Quando o usuário clicar no botão próximo, esta primeira div fica "invisivel" ( altero via javascrip a ID no css display:none). Nesta segunda <div>, agora visivel, tem o formulario com um botão para que o usuário va para a terceira div.

O problema é o seguinte: ao clicar no botao da segunda div, chamo uma função para validar os campos do formulario, se estiver todos os campos preenchidos corretamente, segue para a div três, caso contrario permanece na div dois. Entretanto, se os dados estiverem preenchidos errados, ao invés de permanecer na div, ele volta para a div inicial (a primeira). O que falta implementar na minha função.

 

function ValidaFormulario(){

var tamanho_nome = document.forms["dadosIniciais"].nome.value.length;

 

if ((tamanho_nome < 5 ) || (tamanho_nome > 100)){

 

 

 

}

 

}

Share this post


Link to post
Share on other sites

Se estiver dando submit, vai carregar a página de novo e volta pro passo 1 mesmo!
Usa a função onclick no botao e dentro do seu if joga um código desse tipo:

 

alert("Campo nome inválido!");
return false;

 

Ai ele não da o refresh na página e da um alert pro usuário!

  • +1 1

Share this post


Link to post
Share on other sites

Valeu Fabricio, fiz algo parecido com sua dica, depois de um momento de lucidez que tive. Eu cancelei o evento click do submit e chamei a função de validação. Conforme a resposta ou ele limpava os campos dando focus no campo do nome ou ele fazia a função de troca de divs. Valeu pela dica.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Similar Content

    • By T-Rexz
      O negócio é o seguinte: estou criando apenas um arquivo html bem simples e básico para os atendentes utilizarem para agilizar o serviço deles em vez de inserir manualmente. Então, estou com uma dificuldade para tentar achar o problema que está ocasionando o div sumir após selecionar a segunda opção para baixo (tenta selecionar Beltrano ou Carlitos) na seleção, apenas a primeira opção Fulano está funcionando (outro detalhe: no outro arquivo que tenho segue a mesma lógica, mas é arquivo teste apenas e funciona de escolher qualquer uma das opções normalmente, mesmo sendo um arquivo-teste). Veja o código abaixo e me diz onde tá o erro que está causando??
      PS: estou utilizando o Chrome apenas, a pedido da empresa.
       
      <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <title>SCRIPTS - RECEPÇÃO</title> <style type="text/css"> .carimboExecutador{ background: #ff0000; } .box{ color: #fff; padding: 20px; display: none; margin-top: 20px; } </style> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("select").change(function(){ $(this).find("option:selected").each(function(){ var optionValue = $(this).attr("value"); if(optionValue){ $(".box").not("." + optionValue).hide(); $("." + optionValue).show(); } else{ $(".box").hide(); } }); }).change(); }); function copiarTexto5() { var textoCopiado5 = document.getElementById("link5"); textoCopiado5.select(); document.execCommand("Copy"); } <!-- function copiarTexto() { --> <!-- var textoCopiado = document.getElementById("link"); --> <!-- textoCopiado.select(); --> <!-- document.execCommand("Copy"); --> <!-- } --> function selecionaAtendente() { var puxa = $( "#listaAtendente" ).val(); var str = document.getElementById("link5").value; var n = str.replace(/XX|FULANO|BELTRANO|CARLITOS/gi,puxa); document.getElementById("link5").value=n; } </script> </head> <body> <!-- DIV PARA EXIBIR LISTA DE OPÇÕES --> <div> <h4><font face="arial" color="red">ESCOLHA A SCRIPT:</font></h2> <select> <option disabled selected>Clique aqui para exibir a lista</option> <option disabled></option> <option value="carimboExecutador">Carimbo - Identificação Executador</option> </select> </div> <!-- CLASSES PARA EXIBIR DIVS SELECIONADOS --> <div class="carimboExecutador box"> <h2><font face="arial" color="white">CARIMBO - IDENTIFICAÇÃO EXECUTADOR</font></h2> <b><font face="arial" color="white">Selecione o Responsável:</font></b> <select id="listaAtendente"> <option value="FULANO">Fulano</option> <option value="BELTRANO">Beltrano</option> <option value="CARLITOS">Carlitos</option> </select> <button onclick="selecionaAtendente()">Preencher Técnico</button> <br/><textarea rows="4" cols="90" id="link5" name="link5" readonly> NOME: XX CARGO: ATENDENTE DE TELEMARKETING </textarea> <br/><button onClick="copiarTexto5()">Copiar Texto</button> </div> </body> </html>
    • By thenerb
      Eu estou fazendo um html com uma imagem de fundo com o atributo background e utilizei a tag div com o intuito de colocar uma imagem centralizada e dentro dessa imagem e texto, porém o texto não está sobrepondo a imagem,segue o código:
       
       
      <!DOCTYPE.html>
      <html>
        <head>
          <title>testando</title>
          <link rel='icon' href='favicon (2).ico' type='image/x-icon' >
          <meta charset=utf-8>
        </head>
        <body background="_Space Love_, de Scott Brian madeiras.jpg" >
          <font size="4" color="lavender" face="bradlay hand ITC regular">
            <p style="text-shadow: 0.1em 0.1em 0.15em #ffffff">datas
                   <br/>
              <div style="position:relative; z-index:-1 " align="center" >
               <img width="45%" height="1000px"src="img_como_colocar_fundo_preto_nas_fotos_16171_orig.jpg" />
              </div>
                <div style="position:relative; z-index:1; width="100%";heght="100%" align="center">
                   <p align="center"style="text-shadow: 0.1em 0.1em 0.15em #ffffff "> teste
                   </p>
                </div>
              
          </font>
        </body>
      </html>
    • By victorhupo
      Eu tenho um código html e quero que a partir de um formulário o javascript modifique o conteúdo dele porem tenho um conhecimento raso.
       o código seria esse.
      <textarea> <div class="separator" style="clear: both; text-align: center;"> <a href="https://1.bp.blogspot.com/-TDuaU9uqbks/XVQ-Oj0THFI/AAAAAAAAEJw/mMdKEcvI-LwDoTVkcam8OVPse77LndSowCLcBGAs/s1600/S01E08.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="901" data-original-width="1600" src="https://1.bp.blogspot.com/-TDuaU9uqbks/XVQ-Oj0THFI/AAAAAAAAEJw/mMdKEcvI-LwDoTVkcam8OVPse77LndSowCLcBGAs/s1600/S01E08.png" /></a></div> </textarea> eu preciso que a partir do link q o usuário colocar no formulário ele substitua esse link de imagem pelo que foi colocado na tabela. alguém tem alguma solução?
    • By Aureo Almeida
      Possuo um formulário que está repassando parte dos dados que desejo enviar. Ele busca o resultado de três consultas e duas delas dão opções de seleção para  o usuário em input radio.
      A primeira busca informações de produtos selecionados a partir de um parâmetro recebido via post. Este mesmo parâmetro também estabelece um critério para as outras duas consultas.
      Todas elas funcionam adequadamente, sem problemas. A questão é que ao enviar o formulário somente os dois parâmetros que estão presentes em inputs hidden são enviados. Os dois inputs radio, que são preenchidos de acordo com determinados critérios, não.
      Este é o código do formulario:
      <form action="carrinho.php" method="post"> <?php //Recebe a variavel idproduto da página do produto $sub_id = $_POST['idproduto']; $sql = "SELECT * FROM psd_produtos Where prd_id = '$sub_id'"; $stmt = $conn->prepare($sql); $stmt->execute(); $dados= $stmt->fetchAll(PDO::FETCH_OBJ); foreach ($dados as $detProdutos): $prdid = $detProdutos->prd_id; $nome= $detProdutos->prd_nome; $valor = $detProdutos->prd_valor; $novovalor = number_format($valor, 2, ',', '.'); $quantidade = $detProdutos->prd_estoque; echo" <h2>PREÇO: R$ $novovalor</h2><br/> <input type='hidden' name='id' value='$prdid'> <input type='hidden' name='acao' value='add'> "; endforeach; $sql1 = "SELECT * FROM psd_cores WHERE prd_id = '$sub_id'AND crs_quantidade != '0'"; $stmt1 = $conn->prepare($sql1); $stmt1->execute(); $dados1= $stmt1->fetchAll(PDO::FETCH_OBJ); foreach ($dados1 as $prodCores): if($quantidade!= 0){ echo" <input type='radio' name='cor' id='cor' value='$prodCores->crs_cores' checked='checked'> $prodCores->crs_cores <br> ";} endforeach; $sql2 = "SELECT * FROM psd_sabores WHERE prd_id = '$sub_id'AND sbr_quantidade != '0'"; $stmt2 = $conn->prepare($sql2); $stmt2->execute(); $dados2= $stmt2->fetchAll(PDO::FETCH_OBJ); foreach ($dados2 as $prodSabores): if($quantidade!= 0){ echo" <input type='radio' name='sabor' id='sabor 'value='$prodSabores->sbr_sabor' checked='checked'> $prodSabores->sbr_sabor <br> ";} endforeach; ?> <input type='submit' class='imput-comprar' value='Comprar'> </form> O estranho é que se eu fizer um formulário com uma das  consultas isoladamente da demais, os parâmetros são enviados. Exemplo que funciona:
      <form action="carrinho.php" method="post"> $sql2 = "SELECT * FROM psd_sabores WHERE prd_id = '$sub_id'AND sbr_quantidade != '0'"; $stmt2 = $conn->prepare($sql2); $stmt2->execute(); $dados2= $stmt2->fetchAll(PDO::FETCH_OBJ); foreach ($dados2 as $prodSabores): if($quantidade!= 0){ echo" <input type='radio' name='sabor' id='sabor 'value='$prodSabores->sbr_sabor' checked='checked'> $prodSabores->sbr_sabor <br> ";} endforeach;?> <br><input type='submit' class='imput-comprar' value='Comprar'> </form> O que pode estar impedindo que os valores das duas consultas após a primeira não sejam enviadas em conjunto, somente isoladamente?
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.