Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

erro ajax + php

por Estudante
| 231.9k xp | 114 posts

boa noite pessoal , como faço para quando clicar no botao enviar do meu formulario com ajax ao botão ser clicado salvar e ficar na mesma página? 

    <!-- <script>
        $("form[name='contato']").submit(function(){
            var data = {
                nome: $("input[name='nome'").val(),
                telefone: ("input[name='telefone'").val(),
                email: ("input[name='email'").val(),
                assunto: ("input[name='assunto'").val(),
                mensagem: ("input[name='mensagem'").val()
            };

            console.log(data);

            $.ajax({
                url: enviar.php,
                type: POST,
                data: data,
                dataType: "html"
            }).done(function(response){
                alert(response);
                console.log(response);
            }).fail(function(error){
                console.log(error);
            });
        });
    </script> -->
<?php

    $nome = $_POST['nome'];
    $telefone = $_POST['telefone'];
    $email = $_POST['email'];
    $assunto = $_POST['assunto'];
    $mensagem = $_POST['mensagem'];

    $strcon = mysqli_connect('localhost','root','vertrigo','db_zem') or die('Erro ao conectar ao banco de dados');    

    $sql = "INSERT INTO contato(nome, telefone, email, assunto, mensagem) VALUES ('" . $nome . "', '" . $telefone . "', '" . $email . "', '" . $assunto . "', '" . $mensagem . "')";

    //$sql .= "('$nome', '$telefone', '$email', '$assunto', '$mensagem')"; 
    mysqli_query($strcon, $sql) or die("Erro ao tentar cadastrar registro");
    mysqli_close($strcon);

    echo "Cliente cadastrado com sucesso!";
?>
<form name="contato" class="contato-form" method="post" action="enviar.php">

        <fieldset>
           <br>                


         <label for="nome">Nome</label>                  

         <input  name="nome" type="text"  required="">

         <label for="email">E-mail</label>                  

         <input name="email" type="text" required="">

         <label for="telefone">Telefone</label>                  

         <input name="telefone" type="text" required="">


         <label for="assunto">Assunto</label>                  


         <select name="assunto" >
                      <option value="" disabled selected>Escolha uma opção</option>
                      <option value="orcamento">Solicito orçamento</option>
                      <option value="duvida">Dúvidas</option>
                      <option value="sistema">Sistema </option>
                      <option value="aplicativo">Aplicativo </option>
                      <option value="sugestao">Sugestão</option>
                      <option value="outros">Outros</option>
         </select>


         <label for="mensagem">Mensagem</label>   


         <textarea type="text" name="mensagem" required=""> </textarea>

         <input type="submit" name="enviar" value="enviar" class="buttonLight contato-form-enviar">


         <br><br>

        </form>
3 respostas
por Alex Moreno
| 231k xp | 52 posts
Programador

Oi Nicolle, o seu código estava com problema no html e no javascript, ajustei o código e informei o que estava com problema nos comentários, segue:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<form name="contato" class="contato-form" method="post" action="enviar.php">
    <fieldset>
        <br>
        <label for="nome">Nome</label>
        <input name="nome" type="text" required="">
        <label for="email">E-mail</label>
        <input name="email" type="text" required="">
        <label for="telefone">Telefone</label>
        <input name="telefone" type="text" required="">
        <label for="assunto">Assunto</label>
        <select name="assunto">
            <option value="" disabled selected>Escolha uma opção</option>
            <option value="orcamento">Solicito orçamento</option>
            <option value="duvida">Dúvidas</option>
            <option value="sistema">Sistema</option>
            <option value="aplicativo">Aplicativo</option>
            <option value="sugestao">Sugestão</option>
            <option value="outros">Outros</option>
        </select>
        <label for="mensagem">Mensagem</label>
        <textarea type="text" name="mensagem" required=""> </textarea>
        <input type="submit" name="enviar" value="enviar" class="buttonLight contato-form-enviar">
        <br><br>
    <!--Faltou fechar o fieldset-->
    </fieldset>
</form>
<!--Verifique se você adicionou a biblioteca do JQuery-->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"
        integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
        crossorigin="anonymous">
</script>
<!--Esse bloco do javascript estava comentado-->
<script>
    $("form[name='contato']").submit(function (event) {
        /* Adicione o event.preventDefault() para evitar o submit do formulário */
        event.preventDefault();
        /* A forma que você estava pegando os valores dos campos com o JQuery estava errada */
        var data = {
            nome: $("input[name='nome']").val(),
            telefone: $("input[name='telefone']").val(),
            email: $("input[name='email']").val(),
            assunto: $("select[name='assunto']").val(),
            mensagem: $("textarea[name='mensagem']").val()
        };
        console.log(data);
        /* Os parametros url e type devem ser valores do tipo string */
        $.ajax({
            url: 'enviar.php',
            type: 'POST',
            data: data,
            dataType: "html"
        }).done(function (response) {
            alert(response);
            console.log(response);
        }).fail(function (error) {
            console.log(error);
        });
    });
</script>
</body>
</html>
solução!
por Estudante
| 231.9k xp | 114 posts

Alex ao inserir os dados ficam no meu form , como faço pra quando clicar no botao resetar os dados cadastrados?

por Alex Moreno
| 231k xp | 52 posts
Programador

Você pode inserir o código abaixo no método done do ajax

$("form[name='contato']")[0].reset();

done(function (response) {
    alert(response);
    console.log(response);
    $("form[name='contato']")[0].reset();
})