繁体   English   中英

联系表中的Ajax失败响应

[英]Ajax Failure Response in Contact Form

提交后,我已经获得了联系表单以显示成功消息和加载栏,但是由于某种原因,将不会显示失败消息。 它只是继续显示加载栏。

我尝试使用以下两种方法,但并没有解决问题。 如果未填写必填字段或电子邮件无效,则将显示失败消息。 任何帮助深表感谢。

我试过的

   else if(response == 'failure'){
statusdiv.html('<p class="ajax-success" >Please sure all required information is entered and try again.</p>');
}

 else {
statusdiv.html('<p class="ajax-success" >Please sure all required information is entered and try again.</p>');
}

完整代码:

  <script type="text/javascript" >
function cvf_form_validate(element) {
    $('html, body').animate({scrollTop: $(element).offset().top-100}, 150);
    element.effect("highlight", { color: "#F2DEDE" }, 1500);
    element.effect('shake');
}

jQuery(document).ready(function($) {
var placeholder=$('#status-placeholder');
jQuery('<div id="comment-status"></div>').insertBefore(placeholder);
var statusdiv=$('#comment-status');

    $('body').on('click', '.submit', function() {
       statusdiv.html('<div class="wrap go"><div class="loader bar"><div class="sfmgreen"></div><div class="dkblue"></div><div class="ltblue"></div><div class="aqua"></div></div>');

        if($('.input-name').val() === '') {
            cvf_form_validate($('.input-name'));

        } else if($('.input-email').val() === '') {            
            cvf_form_validate($('.input-email'));

        } else if($('.input-message').val() === '') {              
            cvf_form_validate($('.input-message'));

        } else {
            var data = {
                'action': 'cvf_send_message',
                'name': $('.input-name').val(),
                'email': $('.input-email').val(),
                'message': $('.input-message').val()
            };

            var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>';
            $.post(ajaxurl, data, function(response) {
                if(response === 'success'){
                    statusdiv.html('<p class="ajax-success" >Thanks! Your message has been sent successfully.</p>');
                    $('.input-name').val(''); $('.input-email').val(''); $('.input-message').val('');
                }
                else if(response == 'failure'){
statusdiv.html('<p class="ajax-success" >Please sure all required information is entered and try again.</p>');
}
            });
        }
    });
});
</script>

非常感谢您的帮助和耐心! 我能够弄清楚。

我没有在成功处理程序之后添加错误回调,而是需要在每个输入之后添加它。 这允许错误定义缺少的字段并为用户指定要做什么。

if($('.input-name').val() === '') {
    statusdiv.html('<p class="ajax-error" >Please fill out your name and try again.</p>'); response.status;

} else if($('.input-email').val() === '') {            
    statusdiv.html('<p class="ajax-error" >Please fill out your e-mail and try again.</p>'); response.status;

} else if($('.input-message').val() === '') {              
    statusdiv.html('<p class="ajax-error" >Please add a message and try again.</p>'); response.status;

}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM