Checking for empty spaces in a form in javascript

0

I'm doing my studies trying to finalize a form in the validation part (if it has no blanks) in javascript and then it calls the function file in php sending the data by email, however, I'm having validation problems because I am a bit lazy in javascript. If anyone can give me a hint "I'm trying to learn, I would not want a complete answer," I grumble. I made the validation together in the html after inserting the code of the form.

Follow the code

<div class="box">
                    <form action="funcao.php" method="post" id="formulario_contato" onsubmit="validaForm(); return false;" class="form">
                        <div class="field half first"><input type="text" id="nome"  name="nome" placeholder="Nome" /></div>
                        <div class="field half"><input type="email" id="email" name="email" placeholder="Email" /></div>
                        <div class="field"><textarea name="mensagem" id="mensagem" placeholder="Mensagem"  rows="6"></textarea></div>
                        <ul class="actions">
                            <li>
                              <input  type="submit" value="Enviar Mensagem" />
                            </li>
                        </ul>
                    </form> 
                </div> 

Validation of fields in javascript:

<script type="text/javascript">
    function validaForm()
    {
        erro = false;
        if($('#nome').val() == '')
        {
            alert('Você precisa preencher o campo Nome');erro = true;
        }
        if($('#email').val() == '' && !erro)
        {
            alert('Você precisa preencher o campo E-mail');erro = true;
        }
        if($('#mensagem').val() == '' && !erro)
        {
            alert('Você precisa preencher o campo Mensagem');erro = true;
        }   
    }
        //se nao tiver erros
        if(!erro)
        {
            $('#formulario_contato').submit();

        }

    }
</script>
    
asked by anonymous 18.04.2018 / 15:28

1 answer

0

You need to use the library in this code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Seeifitworks

   function validaForm()
    {
        erro = false;
        if($('#nome').val() == '')
        {
            alert('Você precisa preencher o campo Nome');erro = true;
        }
        if($('#email').val() == '' && !erro)
        {
            alert('Você precisa preencher o campo E-mail');erro = true;
        }
        if($('#mensagem').val() == '' && !erro)
        {
            alert('Você precisa preencher o campo Mensagem');erro = true;
        }   

        //se nao tiver erros
        if(!erro)
        {
            $('#formulario_contato').submit();

        }
        
     }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="box">
                    <form action="funcao.php" method="post" id="formulario_contato" onsubmit="validaForm(); return false;" class="form">
                        <div class="field half first"><input type="text" id="nome"  name="nome" placeholder="Nome" /></div>
                        <div class="field half"><input type="email" id="email" name="email" placeholder="Email" /></div>
                        <div class="field"><textarea name="mensagem" id="mensagem" placeholder="Mensagem"  rows="6"></textarea></div>
                        <ul class="actions">
                            <li>
                              <input  type="submit" value="Enviar Mensagem" />
                            </li>
                        </ul>
                    </form> 
                </div>
    
18.04.2018 / 15:45