doufu3718
2015-06-17 14:37
浏览 65

从Wordpress发送AJAX联系表单时清空电子邮件数据

I'm a noob with AJAX and PHP development.

I have made this HTML contact form in Wordpress custom theme:

<div class="footer-form">

        <form class="footer-form-contact"
              name="contact">
            <h3 class="anuncio" id="formulario-contacto">Contacta con nosotros</h3>
            <input type="text"
                   placeholder="Nombre"
                   name="nombre"
                   id="nombre"
                   required/>
            <input type="email"
                   name="email"
                   id="email"
                   placeholder="Email"/>
            <input type="text"
                   placeholder="Teléfono"
                   name="telefono"
                   id="telefono"
                   required/>
            <textarea
                   name="mensaje"
                   id="mensaje"
                   placeholder="Escribe tu mensaje"
                   required>
            </textarea>
            <input type="checkbox"
                   required
                   name="privacidad"
                   value="privacidad"/>
            <input type="button"
                   id="enviar"
                   value="Enviar"
                   onclick="cargaSendMail()"/>
        </form>

        <div id="c_information" class="hide">
            <p></p>
        </div>

Then I followed this question File path for AJAX script (in Wordpress) to get url path from admin-ajax.php like RRikesh do.

And this is functions.js:

function cargaSendMail(){

$("#enviar").attr("disabled", true);

$(".c_error").remove();

var filter=/^[A-Za-z][A-Za-z0-9_]*@[A-Za-z0-9_]+.[A-Za-z0-9_.]+[A-za-z]$/;
var s_email = $('#email').val();
var s_name = $('#nombre').val();
var s_telefono = $('#telefono').val();
var s_msg = $('#mensaje').val();

if (filter.test(s_email)){
    sendMail = "true";
} else{
    $('#email').after("<span class='c_error' id='c_error_mail'>Ingrese e-mail válido.</span>");
    //aplicamos color de borde si el se encontro algun error en el envio
    $('.footer-form').css("border-color","#e74c3c");
    sendMail = "false";
}
if (s_name.length == 0 ){
    $('#nombre').after( "<span class='c_error' id='c_error_name'>Ingrese su nombre.</span>" );
    var sendMail = "false";
}
if (s_telefono.length == 0 ){
    $('#telefono').after( "<span class='c_error' id='c_error_telefono'>Ingrese su telefono.</span>" );
    var sendMail = "false";
}
if (s_msg.length == 0 ){
    $('#mensaje').after( "<span class='c_error' id='c_error_msg'>Ingrese mensaje.</span>" );
    var sendMail = "false";
}

if(sendMail == "true"){

    var datos = {
        "nombre" : $('#nombre').val(),
        "email" : $('#email').val(),
        "telefono" : $('#telefono').val(),
        "mensaje" : $('#mensaje').val()
    };

    $.ajax({
        url: ajaxurl,
        type: 'POST',
        data: datos + '&action=sendcontacto',


    beforeSend: function () {
        //aplicamos color de borde si el envio es exitoso
        $('.footer-form').css("border-color","#25A25A");
        $("#enviar").val("Enviando…");
    },

    success: function (response) {

        $('.footer-form-contact')[0].reset();
        $("#enviar").val("Enviar");
        $("#c_information p").html(response);
        $("#c_information").fadeIn('slow');
        $("#enviar").removeAttr("disabled");

    }
});

} else{
    $("#enviar").removeAttr("disabled");
}
}

and my function.php:

function send_my_contact(){
$mensaje = $_POST['mensaje'];
$mensaje.= "
----------------------
";
$mensaje.= "
De: ". $_POST['nombre'];
$mensaje.= "
Email: ". $_POST['email'];
$mensaje.= "
Telefono: ". $_POST['telefono'];

$destino = "hola@fiuuu.es";
$remitente = $_POST['email'];
$asunto = "Mensaje enviado desde Talent Institut por ".$_POST['nombre'];
mail($destino,$asunto,$mensaje,"FROM: $remitente");

echo "Mensaje enviado. Gracias por conectarse con nosotros";
}

add_action('wp_ajax_sendcontacto', 'send_my_contact');
add_action('wp_ajax_nopriv_sendcontacto', 'send_my_contact');

It is every thing ok, and the system send me the email correctly, but the data are empty:

----------------------

De: 
Email: 
Telefono:

What am I doing wrong?

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • du3669 2015-06-17 14:39
    已采纳

    I would modify your data to the following, so that the action is explicitly set in datos:

    var datos = {
        "nombre" : $('#nombre').val(),
        "email" : $('#email').val(),
        "telefono" : $('#telefono').val(),
        "mensaje" : $('#mensaje').val(),
        "action": 'sendcontacto'
    };
    
    $.ajax({
        url: ajaxurl,
        type: 'POST',
        data: datos,
    
    已采纳该答案
    打赏 评论

相关推荐 更多相似问题