Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

denialos404

Validação envio de mensagem por AJAX através de formulário de contato

Recommended Posts

Olá, sou novo aqui no fórum e estou com um probleminha no meu formulário de contato, tenho 2 abas - Fale Conosco e Orçamento, ao preencher o formulário de Fale Conosco, consigo receber minha mensagem de notificação de que minha mensagem foi enviada, através de uma messageBox logo acima do formulário, já quando vou para a 2ª aba, preencho o formulário e clico em enviar, não acontece o mesmo com Fale Conosco, conforme imagens em anexo a página é redirecionada com o texto que a mensagem foi enviada com sucesso do meu arquivo mailer-orcamento.php, consequentemente o endereço URL também muda. Se algúem pudesse me ajudar, ficarei muito grato!

 

Código HTML e script externo AJAX:

<!-- Aba 1 Fale Conosco -->
                        <div class="tabs-content iconTabsContent" data-tabs-content="icon-tabs-1">
                            <div class="tabs-panel is-active" id="panel1b">
                                <div id="contact">
                                    <div id="form-messages"></div>

                                    <form data-abide novalidate id="contactForm" name="contactForm" action="<?php echo get_template_directory_uri(); ?>/include/mailer-contato.php" method="post">
                                        <div class="row">
                                            <div class="small-12 medium-6 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="text" id="input-38" name="formNome" placeholder="Seu nome *" required pattern="[a-zA-Z\s]">
                        <label class="input__label input__label--isao" for="input-1">
                          <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">Ei! Você realmente preencheu o campo com seu nome? Tenta de novo!</small>
                                                </label>
                                                </span>
                                            </div>

                                            <div class="small-12 medium-3 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="text" id="input-38" name="formDDD" placeholder="DDD *" required>
                        <label class="input__label input__label--isao" for="input-2">
                          <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">Obrigatório!</small>
                                                </label>
                                                </span>
                                            </div>
                                            <div class="row">
                                                <div class="small-12 medium-2 columns">
                                                    <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="text" id="input-38" name="formTel" placeholder="Telefone *" required>
                        <label class="input__label input__label--isao" for="input-3">
                          <span class="input__label-content input__label-content--isao"></span>
                                                    <small class="form-error">Obrigatório!</small>
                                                    </label>
                                                    </span>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="small-12 medium-6 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="email" id="input-39" name="formMail" placeholder="Seu endereço de e-mail *" required pattern="email">
                      <label class="input__label input__label--isao" for="input-4">
                        <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">É importante saber o que você tem para nos falar!</small>
                                                </label>
                                                </span>
                                            </div>

                                            <div class="small-12 medium-6 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="url" id="input-41" name="formWebsite" placeholder="Seu website (opcional)" pattern="url">
                          <label class="input__label input__label--isao" for="input-6" for="formWebsite">
                            <span class="input__label-content input__label-content--isao" style="padding: 0.75em 0.15em;"></span>
                                                <div class="input-group" style="width: 20%;"><span class="input-group-label">www</span></div>
                                                </label>
                                                </span>
                                            </div>
                                            <div class="small-12 medium-12 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="text" id="input-38" name="formAssunto" placeholder="Assunto *" required>
                        <label class="input__label input__label--isao" for="input-7">
                          <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">Não queremos deixar que seu contato passe despercebido!</small>
                                                </label>
                                                </span>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="small-12 columns">
                                                <label for="formMessage">
                        <textarea id="formMessage" name="formMensagem" placeholder="Sua mensagem *" required style="height: 100px;"></textarea>
                        <small class="form-error">Essa é a parte importante!...não esquece!</small>
                      </label>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="small-12 columns">
                                                <button type="submit" name="formSubmit" id="formSubmit" class="button button--antiman button--text-thin button--text-upper button--size-s button--inverted-alt-contact button--border-thick float-right">Enviar Mensagem</button>
                                            </div>
                                        </div>
                                    </form>

                                </div>
                            </div>
                            <!-- Aba 1 Fale Conosco fim -->
                            
                            <!-- Aba 2 Orcamento -->
                            <div class="tabs-panel" id="panel2b">
                                <div id="contact">
                                    <div id="form-messages"></div>

                                    <form data-abide novalidate id="contactForm" name="contactForm" action="<?php echo get_template_directory_uri(); ?>/include/mailer-orcamento.php" method="post">
                                        <div class="row">
                                            <div class="small-12 medium-6 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="text" id="input-38" name="formNome" placeholder="Qual o seu nome? *" required pattern="[a-zA-Z\s]">
                        <label class="input__label input__label--isao" for="input-8">
                          <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">Ei! Você realmente preencheu o campo com seu nome? Tenta de novo!</small>
                                                </label>
                                                </span>
                                            </div>

                                            <div class="small-12 medium-6 columns">
                                                <span class="input input--isao">
                      <input class="input__field input__field--isao input-group-field" type="text" id="input-40" name="formEmpresa" placeholder="Sua Empresa / Organização *" required/>
                      <label class="input__label input__label--isao" for="input-12" for="formCompany">
                        <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">Queremos o nome da sua empresa ou organização.</small>
                                                </label>
                                                </span>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="small-12 medium-6 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="email" id="input-39" name="formMail" placeholder="Seu endereço de e-mail *" required pattern="email">
                      <label class="input__label input__label--isao" for="input-11">
                        <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">É importante saber o que você tem para nos falar!</small>
                                                </label>
                                                </span>
                                            </div>
                                            <div class="small-12 medium-2 columns">
                                                <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="text" id="input-38" name="formDDD" placeholder="DDD *" required>
                        <label class="input__label input__label--isao" for="input-2">
                          <span class="input__label-content input__label-content--isao"></span>
                                                <small class="form-error">Obrigatório!</small>
                                                </label>
                                                </span>
                                            </div>
                                            <div class="row">
                                                <div class="small-12 medium-4 columns">
                                                    <span class="input input--isao">
                        <input class="input__field input__field--isao input-group-field" type="text" id="input-38" name="formTel" placeholder="Telefone *" required>
                        <label class="input__label input__label--isao" for="input-3">
                          <span class="input__label-content input__label-content--isao"></span>
                                                    <small class="form-error">Obrigatório!</small>
                                                    </label>
                                                    </span>
                                                </div>
                                            </div>

                                            <div class="marginBottom">
                                                <div class="small-12 medium-12 columns">
                                                    <span class="">
                        <p style="font-size: 14px">O que podemos desenvolver para você?</p>
													<input class="chkbox" type="checkbox" name="services[]" value="Website "><label class="" style="color: #000; vertical-align:top;">Website</label>
												</span>
                                                    <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Sistema Web "><label class="" style="color: #000; vertical-align:top;">Sistema Web
													<small class="form-error">Selecione pelo menos uma opção!</small></label>
												</span>
                                                    <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Loja Virtual "><label class="" style="color: #000; vertical-align:top;">Loja Virtual</label>
												</span>
                                                    <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Landing Page "><label class="" style="color: #000; vertical-align:top;">Landing Page</label>	
												</span>
                                                    <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Blog "><label class="" style="color: #000; vertical-align:top;">Blog</label>
												</span>
                                                    <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Logotipo "><label class="" style="color: #000; vertical-align:top;">Logotipo</label>
												</span>
                                                    <div>
                                                        <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Marketing e Conteúdo "><label class="" style="color: #000; vertical-align:top;">Marketing de Conteudo</label>
												</span>
                                                        <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Otimização de Sites "><label class="" style="color: #000; vertical-align:top;">Otimizacao de Sites</label>
												</span>
                                                        <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Gestão de Redes Sociais "><label class="" style="color: #000; vertical-align:top;">Gestao de Redes Sociais</label>
												</span>
                                                        <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Identidade Visual "><label class="" style="color: #000; vertical-align:top;">Identidade Visual</label>
												</span>
                                                        <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" SEO "><label class="" style="color: #000; vertical-align:top;">SEO</label>
													</span>
                                                        <div>
                                                            <span class="">
													<input class="chkbox" type="checkbox" name="services[]" value=" Papelaria Corporativa "><label class="" style="color: #000; vertical-align:top;">Papelaria Corporativa</label>
													</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div>
                                            </div>
                                        </div>

                                        <div class="row" style="margin-top: 30px;">
                                            <div class="small-12 columns">
                                                <label for="formMessage">
                        <textarea id="formMessage" name="formMensagemOrcamento" placeholder="Diga-nos sobre mais detalhes do seu projeto! *" required style="height: 100px;"></textarea>
                        <small class="form-error">Essa é a parte importante!...não esquece!</small>
                      </label>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="small-12 columns">
                                                <button type="submit" name="formSubmit" id="formSubmit" class="button button--antiman button--text-thin button--text-upper button--size-s button--inverted-alt-contact button--border-thick float-right">Enviar Mensagem</button>
                                            </div>
                                        </div>
                                    </form>

                                </div>
                            </div>
                            <!-- Aba 2 fim -->
                          
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/ajax-form.js"></script>

 

1.PNG

2.PNG

3.PNG

Compartilhar este post


Link para o post
Compartilhar em outros sites

Kd o código ajax? Se o código php está funcionando, o erro está no html e js, posta o js ou revise o mesmo pra vê se está de acordo.

Compartilhar este post


Link para o post
Compartilhar em outros sites
11 horas atrás, manoaj disse:

Kd o código ajax? Se o código php está funcionando, o erro está no html e js, posta o js ou revise o mesmo pra vê se está de acordo.

 

Aqui vai o código em AJAX manoaj:

 

$(function() {

            // obter formulário
            
            var form = $('#contactForm'); //aqui tá tudo ok
            var form = $('#contactFormOrcamento'); //não mostra a messageBox e redireciona para a página com URL do arquivo .php
            var form = $('#contactFormSuporte'); //não mostra a messageBox e redireciona para a página com URL do arquivo .php

            // obter mensagens da div.
            var formNotifications = $('#form-messages');

            // Configurar um ouvinte de eventos para o formulário de contato
            $(form).submit(function(e) {
                // Parar o navegador de enviar o formulário
                e.preventDefault();

                var formData = $(form).serialize();

                // Enviar o formulário usando AJAX.
                $.ajax({
                        type: 'POST',
                        url: $(form).attr('action'),
                        data: formData
                    })
                    .done(function(response) {
                        // Certificar-se de que a div formNotifications tenha a classe 'sucesso'.
                        $(formNotifications).removeClass('errorMsg');
                        $(formNotifications).addClass('successMsg');

                        // definir o texto na mensagem.
                        $(formNotifications).text(response);

                        // limpar o formulário após o envio
                        $('#formNome').val('');
                        $('#formDDD').val('');
                        $('#formTel').val('');
                        $('#formMail').val('');
                        $('#formEmpresa').val('');
                        $('#formWebsite').val('');
                        $('#formAssunto').val('');
                        $('#formMensagem').val('');
                    })
                    .fail(function(data) {
                        // Certificar-se de que a div formNotifications tenha a classe 'erro'.
                        $(formNotifications).removeClass('successMsg');
                        $(formNotifications).addClass('errorMsg');

                        // definir o texto na mensagem.
                        if (data.responseText !== '') {
                            $(formNotifications).text(data.responseText);
                        } else {
                            $(formNotifications).text('Oops! Um erro ocorreu e sua mensagem não pode ser enviada.');
                        }
                    });

            });

        });

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por landerbadi
      Boa tarde pessoal. Estou tentado fazer uma consulta no banco de dados porém estou tendo dificuldades. Tenho uma tabela chamada "itens" com os seguintes campos: id, item, ativo. Nela tem cadastrado vários itens. No campo ativo eu coloco a letra "S" para informar que este item está ativo no sistema. Por exemplo: 1, casa, S 2, mesa, S 3, cama, S 4, moto S 5, rádio O quinto registro "radio" não está ativo no sistema pois não tem um "S" no campo ativo. E outra tabela chamada "produtos" com os seguintes campos (id, item1, item2, item3) com os seguintes registros: 1, casa, mesa, moto 2, mesa, casa, cama 3, rádio, cama, mesa Eu preciso fazer uma busca na tabela produtos da seguinte maneira: Eu escolho um registro na tabela "itens", por exemplo "mesa". Preciso fazer com que o php me liste todos os registros da tabela "produtos" que contenham a palavra "mesa". Até aqui tudo bem eu consigo listar. Estou fazendo assim: <?php $item = "mesa" $sql = mysqli_query($conn, "SELECT * FROM produtos WHERE item1 LIKE '$item' OR item2 LIKE '$item' OR item3 LIKE '$item' LIMIT 10"); while($aux = mysqli_fetch_assoc($sql)) { $id = $aux["id"]; $item1 = $aux["item1"]; $item2 = $aux["item2"]; $item3 = $aux["item3"]; echo $id . " - " . $item1 . ", " . $item2 . ", " $item3 . "<br>"; } ?> O problema é que está listando todos os registros que contém o item mesa. Eu preciso que o php verifique os demais item e me liste somente os registro em que todos os registros estejam ativos no sistema. No exemplo acima ele não deveria listar o registro 3. pois nesse registro contém o item "radio" e este item não está ativo no sistema. Ou seja, o registro "radio" na tabela itens não possui um "S" na coluna "ativo". Alguém sabe como resolver isso?
    • Por ILR master
      Fala galera.
      Espero que todos estejam bem.
      Seguinte: Tenho um arquivo xml onde alguns campos estão com : (dois pontos), como o exemplo abaixo:
       
      <item>
      <title>
      d sa dsad sad sadasdas
      </title>
      <link>
      dsadas dsa sad asd as dsada
      </link>
      <pubDate>sadasdasdsa as</pubDate>
      <dc:creator>
      d sad sad sa ad as das
      </dc:creator>
      </item>
       
      Meu código:
       
      $link = "noticias.xml"; 
      $xml = simplexml_load_file($link); 
      foreach($xml -> channel as $ite) {     
           $titulo = $ite -> item->title;
           $urltitulo = $ite -> item->link;
           print $urltitulo = $ite -> item->dc:creator;
      } //fim do foreach
      ?>
       
      Esse campo dc:creator eu não consigo ler. Como faço?
       
      Agradeço quem puder me ajudar.
       
      Abs
       
       
    • Por First
      Olá a todos!
       
      Eu estou criando um sistema do zero mas estou encontnrando algumas dificuldades e não estou sabendo resolver, então vim recorrer ajuda de vocês.
      Aqui está todo o meu código: https://github.com/PauloJagata/aprendizado/
       
      Eu fiz um sistema de rotas mas só mostra o conteúdo da '/' não sei porque, quando eu tento acessar o register nada muda.
      E eu também quero que se não estiver liberado na rota mostra o erro de 404, mas quando eu tento acessar um link inválido, nada acontece.
      Alguém pode me ajudar com isso? E se tiver algumas sugestão para melhoria do código também estou aceitando.
       
       
      Desde já, obrigado.
    • Por landerbadi
      Olá pessoal, boa tarde
       
      Tenho uma tabela chamada "produtos" com os seguintes campos (id, produto) e outra tabela chamada "itens" com os seguintes campos (id, prod_01, prod_02, prod_03, prod_04).
       
      Na tabela produtos eu tenho cadastrado os seguintes produtos: laranja, maçã, uva, goiaba, arroz, feijão, macarrão, etc.
       
      Na tabela itens eu tenho cadastrado os itens da seguinte maneira:
       
      1, laranja, uva, arroz, feijão;
      2, maçã, macarrão, goiaba, uva;
      3, arroz, feijão, maçã, azeite
       
      Meu problema é o seguinte: 
      Eu escolho um produto da tabela "produtos", por exemplo "uva".  Preciso fazer uma consulta na tabela "itens" para ser listado todos os registros que contenham o produto "uva" e que todos os demais produtos estejam cadastrados na tabela "produtos".
       
      No exemplo acima seria listado apenas dois registros, pois o terceiro registro não contém o produto "uva". 
       
      Alguém pode me ajudar? Pois estou quebrando a cabeça a vários dias e não consigo achar uma solução.
    • Por ILR master
      Pessoal, pergunta bem simples. Abaixo tenho o seguinte código:
       
      <script>
      function alerta()
      {
        if (window.confirm("Você realmente quer sair?")) {
          window.open("sair.html");
      }
      }
      </script>
       
      Funciona perfeitamente, só que está abrindo em outra janela e quero que abra na mesma janela.
       
      Alguém pode me ajudar?
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.