0

Estou criando um plugin para o CMS Wordpress, nele tenho um script que roda perfeitamente até a parte de fazer a requisição ajax para gravar alguns dados no banco de dados. O código funciona até a parte de exibir o texto dentro da div passo2form que inicialmente fica vazia e após clicar no botão o texto é inserido dentro dela. Porém os dados não são gravados no banco de dados. Meu código está assim:

Html principal:

<div class='principal-form'>

        <input type='text' name='nome' id='nome' class='campo-form' placeholder='Nome' maxlength='50'><br>
        <input type='email' name='email' id='email' class='campo-form' placeholder='Email' maxlength='120'/>
        <button type='submit' id='enviarform' class='botao-enviar'>Efetuar Simulação</button>

</div>

<div id='passo2form' class='passo2form'></div>

Arquivo Javascript que é executado:

jQuery('#enviarform').click(function(){
        var nome = document.getElementById('nome').value;
        var email = document.getElementById('email').value;

        jQuery( "#passo2form" ).html("<div class='col-md-35 padding-top-15'><div class='texto-ola'><p>Olá <span class='cor-vermelho'>" + nome + "</span>,</p><p>Estaremos enviando em breve sua cotação para o email <span class='cor-vermelho'>" + email + " </span></p></div></div>");




var formData = {
        'nome'              : jQuery('input[name=nome]').val(),
        'email'             : jQuery('input[name=email]').val()
    };

    // process the form
    jQuery.ajax({
        type        : 'POST',
        url         : 'processa.php',
        data        : formData,
        dataType    : 'json',
        encode      : true
    })
        .done(function(data) {

            console.log(data); 

        });

});

Eu testei o arquivo ´processa.php´ e funciona perfeitamente fazendo a inserção dos dados no banco. Mas segue o código:

<?php
include_once($_SERVER['DOCUMENT_ROOT'].'/wordpress/wp-config.php' );

global $wpdb;

$nome = trim($_POST['nome']);
$email = trim($_POST['email']); 

$wpdb->insert(
        wp_formclientes,
        array(
            'nome'    => $_POST['nome'],
            'email'   => $_POST['email']
        )
    );

$wpdb->show_errors();

?>
5
  • Dá algum erro no console? 29/09/2016 às 0:42
  • @SampaioLeal não me retorna nenhum erro
    – Wendell
    29/09/2016 às 0:46
  • @Wendell Na aba Network do seu web inspector aparece a requisição para o processa.php?
    – rdleal
    29/09/2016 às 3:09
  • @PanterA não aparece, somente a requisição do processa.js que é o arquivo do script.
    – Wendell
    29/09/2016 às 3:18
  • @Wendell com a aba de Networks aberta, e clicando no botão #enviarform nada aparece? E o que essa propriedade encode: true no objeto enviado para o jQuery.ajax faz? Não encontrei ela na documentação oficial.
    – rdleal
    29/09/2016 às 3:22

2 Respostas 2

0

Ah, vou fazer uma cópia do seu código usando as funções básicas do JQuery, você poderia testar e ver se faz diferença:

$('#enviarform').click(function(){
        var nome = $('#nome').val();
        var email = $('#email').val();

        $( "#passo2form" ).html("<div class='col-md-35 padding-top-15'><div class='texto-ola'><p>Olá <span class='cor-vermelho'>" + nome + "</span>,</p><p>Estaremos enviando em breve sua cotação para o email <span class='cor-vermelho'>" + email + " </span></p></div></div>");




var formData = {
        'nome'              : $(nome).val(),
        'email'             : $(email).val()
    };

    // process the form
    $.ajax({
        type        : 'POST',
        url         : 'processa.php',
        data        : formData,
        dataType    : 'json',
        encode      : true
    })
        .done(function(data) {

            console.log(data); 

        });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='principal-form'>

        <input type='text' name='nome' id='nome' class='campo-form' placeholder='Nome' maxlength='50'><br>
        <input type='email' name='email' id='email' class='campo-form' placeholder='Email' maxlength='120'/>
        <button type='submit' id='enviarform' class='botao-enviar'>Efetuar Simulação</button>

</div>

<div id='passo2form' class='passo2form'></div>

1
  • não funcionou, continua da mesma forma, todas as demais funções funcionam mas não grava nada no banco de dados. Se eu criar um form action do tipo post e direcionar para o arquivo processa.php os dados são gravados no banco de dados. Então acredito que o problema é na função em ajax.
    – Wendell
    29/09/2016 às 1:03
0

Eu consegui solucionar. Primeiramente adicionei uma função no arquivo principal do plugin, como esta:

function addCustomer(){

global $wpdb;

$nome = trim($_POST['nome']);
$email = trim($_POST['email']); 

if($wpdb->insert('wp_formclientes',array(
'nome'=>$nome,
'email'=>$email
))===FALSE){

echo "Error";
}
else {
    //mensagem de sucesso
}
add_action('wp_ajax_addCustomer', 'addCustomer');
add_action('wp_ajax_nopriv_addCustomer', 'addCustomer');

E isto foi no meu arquivo processa.js:

var urlsite = jQuery('#urlsite').val();
var urlsitenova = urlsite + "/wp-admin/admin-ajax.php";

jQuery('#cadastraForm').submit(ajaxSubmit);

function ajaxSubmit(){

    var newCustomerForm = jQuery(this).serialize();

    jQuery.ajax({
    type:"POST",
    url: urlsitenova,
    data: newCustomerForm,
    success:function(data){
    jQuery("#feedback").html(data);
    }
});

return false;
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .