Validar Formulário com Jquery

Script atualizado, está mais simples, funcional e bonito (kkk) , abaixo o link:

https://clares.wordpress.com/2012/06/02/validacao-de-formularios-com-jquery-plugin-atualizado/

16 pensamentos sobre “Validar Formulário com Jquery

  1. Paulo De Tarso outubro 26, 2010 às 7:19 pm

    Oi Rafael,

    Tudo bem contigo? Primeiramente parabéns pelo ótimo site, sempre me ajudou e continua ajudando…

    Gostaria de saber como faço utilizando esse seu exemplo submeter os dados do formulário para outra página e lá resgatar e utilizar no meu sistema de EMAIL já pronto em php, Tem como? Fiz uns testes aki, mas te confesso que estou totalmente perdido.

    Abraços,

    • Rafael Clares outubro 26, 2010 às 7:26 pm

      Paulo, o processo é comum, é que neste formulário não tem o action, é aí que se perdeu ?
      Então, após a validação você pode submeter o formulário com o javascript, vejamos o exemplo
      Eu comentei no post uma função assim:
      function teste(){
      // valida o forumario f1
      validate(‘f1’);
      //checa a validacao
      if(validateState){
      //seu codigo
      alert(‘validado’);
      }
      }

      Daí basta você alterar o alert para um submit, ou seja, sabendo que o formulário foi validado você o submete dessa forma:

      function teste(){
      validate(‘f1’);
      if(validateState){
      document.f1.submit(); // supondo que f1 é o nome/id do formulário
      }
      }

      abs

  2. Paulo De Tarso outubro 26, 2010 às 10:59 pm

    Grande Rafael,

    Obrigado pela atenção… E desculpa o incomodo.

    Eu me perdi no seguinte, vi a questão do alert… E coloquei o submit. Eu já tenho uma função php que manda o email para o cliente juntamente com uma cópia. Eu queria passar as váriaveis desse form para a função lá… Ex.: send.php juntamente com as variáveis. Mas, não to sabendo como fazer… Tentei algumas coisas, por exemplo:

    function add(){
    validate(‘contato’);
    if(validateState){

    //Pega o valor do campo Nome
    var nome = $(‘#nome’).val();
    //Pega o valor do campo Email
    var email = $(‘#email’).val();
    //Pega o valor do campo Telefone
    var tel = $(‘#tel’).val();
    //Pega o valor do campo Assunto
    var assunto = $(‘#assunto’).val();

    $.post(‘util/send.php’, {Nome: nome, Email: email, Telefone: tel, Assunto: assunto});
    }
    }

    Mas, não obtive sucesso… Ele até dispara o email, mas sem os dados… to perdidinho da Silva… rsrs

    Abraços,

    • Rafael Clares outubro 26, 2010 às 11:07 pm

      Ah, entendi! Mas como está no send.php ?
      como fez para pegar as vars nele ?

      Faz assim no send.php
      extract($_POST);
      print “teste var $Assunto”; exit;

      para ver se ele extrai as vars e as printa;

      dai na funcao post do Jquery faça assim:
      $.post(‘util/send.php’.{Nome:nome, Email:email, Telefone>tel, Assunto: assunto}, function(data){
      alert(data)
      });

      para ver se ele vai dar o alert com o valor do print do send.php

      Ah, pelo que observei você está mandando as vars no post com a primeira letra maíscula, além de não ser uma boa prática você pode esquecer na hora de recupera-la. Por ex:
      Se você fizer
      print $_POST[‘assunto’]; // nao retorna nada pq a var que está mandando está em maiscula
      print $_POST[‘Assunto’]; // esse retornará algo

      entao no Jquery aconselho enviar {assunto: assunto, email: email …etc}

      abs

      • Paulo De Tarso outubro 26, 2010 às 11:36 pm

        Oi Rafa,

        Fiz a modificação como sugeriu e o print esta retornando o que esta escrito no formulário.

        Podes até observar se quiser: http://www.ditarso.com/pamella/contato_02.php

        Hmmm.. Estou te incomodando não é? Me perdoa..

      • Rafael Clares outubro 26, 2010 às 11:43 pm

        ahhhhhhhhhhhhhhhhhhhhhhhhhhh powwwwwwwwwwwwwwwwwwwwwwwwwww aeeeeeeeeeeeeeeeee naoooooooooooo vaiiiiiiiiiiiiiiiiiiii

        olha só, seu form tá assim:
        name=”assunto” id=”str”
        o Jquery pega o valor pelo id e não pelo name ….
        você tem que colocar o name e id igual !

        name=”assunto” id=”assunto”
        name=”email” id=”email”

        tendeu ?
        abs

  3. Paulo De Tarso outubro 26, 2010 às 11:59 pm

    Oi Rafa,

    Eu entendi, mas aonde entra a validação do formulário que você esta colocando aki…? Lembra que Ela utiliza o id=”str” para dizer que o campo é string e que vai haver a ação da validação?

    • Rafael Clares outubro 27, 2010 às 12:06 am

      Não, não tem relação!
      Eu utilizei id=”str” como exemplo, o que define o tipo do campo é o class=”required numeric” se nao colocar o numeric, automaticamente será string.
      Coloque o form no padrão, id e name iguais para cada campo.
      <input type=”text” name=”nome” id=”nome” class=”required” />
      <input type=”text” name=”assunto” id=”assunto” class=”required” />
      Etc…

  4. Paulo De Tarso outubro 27, 2010 às 12:07 am

    Rafa,
    Boa Noite.

    Fiz a modificação e realmente, funcionou como uma luva… Agora assim, o php não esta mais reconhecendo essas váriavies no send.php eu tenho de extrair elas de alguma forma e coloca-las em variaveis?

    • Rafael Clares outubro 27, 2010 às 12:09 am

      Pode extrair normalmente como sempre fez, acredito que faça assim né:
      $assunto = $_POST[‘assunto’];
      Bem, se for assim está certo mas dá uma lida nesse post:
      https://clares.wordpress.com/2010/09/29/dados-via-post-com-php/

      abs

    • Paulo De Tarso outubro 27, 2010 às 12:12 am

      Rafa,

      Brother, muito obrigado… Mano, funcionou perfeitamente agora… Retirei o print e tudo funcionou normalmente, Deus te abençoe amigo, obrigado pela sua disposição e pela sua atenção…

      Muito obrigado mesmo abraços.

      Deus te abençoe,

      • Rafael Clares outubro 27, 2010 às 12:14 am

        aê, que bom que deu certo, boa sorte brother!
        até mais,

  5. quinhone janeiro 13, 2012 às 8:47 pm

    Sei que o post é antigo, mas…
    tem como adaptar uma verificação de login no BD, pra verificar se o login já existe?
    se tiver como aí fica filé.

    eu até tenho aqui mas não consegui adaptar, segue o código:

    $(‘#form-conta-criar’).validate({
    rules:{
    usu_login:{ required: true, remote: ‘/verifica_login.php’ }
    },
    messages:{
    usu_login:{ required: ‘Este Campo é requerido’ , remote: ‘Login já está em uso.’}
    }
    });

    nesse caso ele usa o plugin do jQuery (jquery.validate)

    • Rafael Clares janeiro 19, 2012 às 10:22 pm

      O ideal é :
      – criar uma função PHP que faça uma verificação no banco e retorne 0 ou 1;
      – criar uma função JQuery que envie o login para o PHP e verifique seu retorno, dê a mensagem de acordo com o mesmo;

      Vou esboçar aqui as funções:

      PHP:: getlogin.php

      if(isset($_POST[‘login’]) && !empty($_POST[‘login’]))
      {
      $login = trim($_POST[‘login’]);
      getLogin($login);
      }

      function getLogin($login)
      {
      $query = mysql_query(“SELECT username FROM users where username = ‘$login'”);
      if($query && count($query) >= 1)
      {
      echo 0; //o login existe
      }
      else
      {
      echo 1; // login nao existe
      }
      }

      JQuery::

      $(‘#usernameInput’).live(‘change’,function(){
      var login = $.trim($(‘#usernameInput’).val())
      $.post(‘getlogin.php’,{login:login},function(data){
      if(data == 0)
      {
      alert(‘usuario existe)
      }
      elseif(data == 1)
      {
      alert(‘usuario nao existe’)
      }
      else
      {
      alert(‘o sistema quebrou’ + data)
      }
      })
      })

    • Rafael Clares janeiro 19, 2012 às 10:24 pm

      O ideal é :
      – criar uma função PHP que faça uma verificação no banco e retorne 0 ou 1;
      – criar uma função JQuery que envie o login para o PHP e verifique seu retorno, dê a mensagem de acordo com o mesmo;

      Vou esboçar aqui as funções:

      PHP:: getlogin.php

      if(isset($_POST[‘login’]) && !empty($_POST[‘login’]))
      {
      $login = trim($_POST[‘login’]);
      getLogin($login);
      }

      function getLogin($login)
      {
      $query = mysql_query(“SELECT username FROM users where username = ‘$login'”);
      if($query && count($query) >= 1)
      {
      echo 0; //o login existe
      }
      else
      {
      echo 1; // login nao existe
      }
      }

      JQuery::

      $(‘#usernameInput’).live(‘change’,function(){
      var login = $.trim($(‘#usernameInput’).val())
      $.post(‘getlogin.php’,{login:login},function(data){
      if(data == 0)
      {
      alert(‘usuario existe)
      }
      elseif(data == 1)
      {
      alert(‘usuario nao existe’)
      }
      else
      {
      alert(‘o sistema quebrou’ + data)
      }
      })
      })

      //considerando que usernameInput é o ID/Name do input que recebe o login;

      É mais ou menos por aí, faça um teste de me fale, ok?
      Abraços

  6. André Felipe fevereiro 19, 2012 às 4:14 pm

    Mt bom o post

Os comentários estão desativados.

%d blogueiros gostam disto: