Form works on desktop more in responsive no!

0

I have a problem that is the following I have a page page.php, which has some php includes includes pulling files that contains the structure of my form, which then sends to a page with message "success", on the desktop it works I have tried to validate the fields in html 5 using the required one, as I thought that was the problem. I deleted it and tried it in js, but nothing yet ... Here is the code I'm trying:

<div role="form" class="wpcf7" id="wpcf7-f728-p242-o1" lang="pt-BR" dir="ltr">
<div class="screen-reader-response"></div>
<form action="http://www.site.com.br/seguro-guincho-24-horas-recebido-com-sucesso" id="formulario" onsubmit="return calculo();" enctype="multipart/form-data" method="post" class="wpcf7-form">
<h2>Dados do Cliente</h2>
<p>Seu nome (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-name">
    <input type="text" name="nome" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Data de Nascimento<br />
  <span class="wpcf7-form-control-wrap your-nascimento">
    <input type="text" name="nascimento" value="" size="40" class="wpcf7-form-control wpcf7-text" />
  </span></p>
<p>Seu CPF ou CNPJ (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-cpf">
    <input type="text" name="cpf" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Seu Endereço com número (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-end">
    <input type="text" name="endereco" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Complemento<br />
  <span class="wpcf7-form-control-wrap your-comp">
    <input type="text" name="complemento" value="" size="40" class="wpcf7-form-control wpcf7-text" />
  </span></p>
<p>Seu Bairro (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-bairro">
    <input type="text" name="bairro" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Sua Cidade (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-cidade">
    <input type="text" name="cidade" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Seu Estado (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-estado">
    <input type="text" name="estado" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Seu Cep (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-cep">
    <input type="text" name="cep" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Seu Telefone (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-tel">
    <input type="text" name="telefone" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Telefone 2<br />
  <span class="wpcf7-form-control-wrap your-tel2">
    <input type="text" name="telefone2" value="" size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" />
  </span></p>
<p>Seu e-mail (obrigatório)<br />
  <span class="wpcf7-form-control-wrap your-email">
    <input type="email" name="email" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" <?php /*?>required<?php */?> />
  </span></p>
<p>Como nos conheceu<br />
  <span class="wpcf7-form-control-wrap menu-868">
    <select name="outros" class="wpcf7-form-control wpcf7-select" aria-invalid="false">
      <option value="Outros">Outros</option>
      <option value="Indicação de Amigo">Indicação de Amigo</option>
      <option value="Google">Google</option>
      <option value="Yahoo">Yahoo</option>
      <option value="MSN">MSN</option>
      <option value="Facebook">Facebook</option>
      <option value="Skype">Skype</option>
      <option value="Renovação">Renovação</option>
    </select>
  </span></p>
<p>Obs:<br />
  <span class="wpcf7-form-control-wrap your-message">
    <textarea name="mensagem" cols="40" rows="10" class="wpcf7-form-control wpcf7-textarea"></textarea>
  </span></p>
<h2>Dados do Veículo</h2>
<p>Marca (obrigatório)<br />
  <span class="wpcf7-form-control-wrap marca">
    <input type="text" name="marca" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Modelo (obrigatório)<br />
  <span class="wpcf7-form-control-wrap modelo">
    <input type="text" name="modelo" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Ano de Fabricação / Ano do modelo (obrigatório)<br />
  <span class="wpcf7-form-control-wrap ano">
    <input type="text" name="ano" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Cor (obrigatório)<br />
  <span class="wpcf7-form-control-wrap cor">
    <input type="text" name="cor" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Placa (obrigatório)<br />
  <span class="wpcf7-form-control-wrap placa">
    <input type="text" name="placa" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Chassi (obrigatório)<br />
  <span class="wpcf7-form-control-wrap chassi">
    <input type="text" name="chassi" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" <?php /*?>required<?php */?> />
  </span></p>
<p>Combustível (obrigatório)<br />
  <span class="wpcf7-form-control-wrap menu-372">
    <select name="combustivel" class="wpcf7-form-control wpcf7-select">
      <option value="Total Flex">Total Flex</option>
      <option value="Gasolina">Gasolina</option>
      <option value="Álcool">Álcool</option>
      <option value="Diesel">Diesel</option>
      <option value="Bio Diesel">Bio Diesel</option>
      <option value="GNV">GNV</option>
      <option value="Elétrico">Elétrico</option>
    </select>
  </span></p>
<h2>Aceite de Contrato</h2>
<p><span class="wpcf7-form-control-wrap contrato"><span class="wpcf7-form-control wpcf7-checkbox wpcf7-validates-as-required"><span class="wpcf7-list-item first last">
  <input type="checkbox" name="contrato" value="Li as Condições Gerais da Assistência 24 horas para Guinchos e Aceito" <?php /*?>required<?php */?> />
  <span class="wpcf7-list-item-label">Li as Condições Gerais da Assistência 24 horas para Guinchos e Aceito</span></span></span></span><br />
  <a href="<?php echo site_url(''); ?>/plano-de-seguro-guincho-24-horas-pdf" target="_blank">Clique Aqui para ler as condições.</a> (Obrigatório)</p>
<p>
<input type="hidden" value="[email protected]" name="emaildestinatario" />
<input type="hidden" value="Formulário do Site - Guinchos" name="assunto" />
<input name="Submit" type="submit" class="campo-cinza" value="Contrate Com PagSeguro" tabindex="13"/>
</p>
</form>
</div>


<script>
function validaErroBranco(campo, mensagem) {
    if (campo.value !== "") return true;
    alert(mensagem);
    campo.focus();
    return false;
}

function calculo() {
    var formulario = document.getElementById("formulario");

    var valido = validaErroBranco(formulario.nome, "Preencha seu nome corretamente.")
        && validaErroBranco(formulario.email, "Preencha seu e-mail corretamente.")
        && validaErroBranco(formulario.telefone, "Preencha seu telefone corretamente.")
        && validaErroBranco(formulario.endereco, "Preencha seu endereço corretamente.")
        && validaErroBranco(formulario.cidade, "Preencha sua cidade corretamente.")
        && validaErroBranco(formulario.cpf, "Preencha o campo CPF.")
        && validaErroBranco(formulario.bairro, "Preencha o campo Bairro*.")
        && validaErroBranco(formulario.estado, "Preencha o campo Estado.")
        && validaErroBranco(formulario.cep, "Preencha o campo CEP.")
        && validaErroBranco(formulario.marca, "Preencha o campo Marca.")
        && validaErroBranco(formulario.modelo, "Preencha o campo Modelo.")
        && validaErroBranco(formulario.ano, "Preencha o campo Ano.")
        && validaErroBranco(formulario.cor, "Preencha o campo Cor.")
        && validaErroBranco(formulario.placa, "Preencha o campo Placa.")
        && validaErroBranco(formulario.chassi, "Preencha o campo Chassi.")
        && validaErroBranco(formulario.contrato, "Preencha o campo Contrato.");
if (!valido) return false;
            }       
</script>
    
asked by anonymous 17.10.2017 / 13:44

0 answers