Error & Success Message is not showing while Contact Form Submitting

Hello I am new to PHP
Made a Contact form with Google ReCaptcha But Having issue whiel submitting the Form.

Message is not display ( Error, success) Getting a blank yellow bar

PHP

<?php

if($_SERVER["REQUEST_METHOD"] == "POST"){
    $name = trim($_POST["username"]);
    $phone = trim($_POST["phone"]);
    $email = filter_var(trim($_POST["email"]), FILTER_SANITIZE_EMAIL);
    $message = trim($_POST["message"]);
    if(isset($_POST['g-recaptcha-response'])){
        $captcha = $_POST['g-recaptcha-response'];
    }
    
    //Validate the data
    if (empty($name) OR empty($phone) OR !filter_var($email, FILTER_VALIDATE_EMAIL) OR empty($message) OR empty($captcha)) {
        http_response_code(400);
        echo "Please Fill all the form inputs and check the captcha to submit.";
        exit;
    }
    
    //recipient email address.
    $recipient ="info@melbournecctvinstallations.com.au";
    $subject = "New message from contact form";
    
    //email content.
    $email_content = "Name: $name\n";
    $email_content .= "Phone: $phone\n\n";
    $email_content .= "Email: $email\n\n";
    $email_content .= "Message: \n$message\n";
    
    //email headers
    $email_headers = "From: $name <$email>";
    
    $response=file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=SECRETKEY&response=".$captcha."&remoteip=".$_SERVER['REMOTE_ADDR']);
    $decoded_response = json_decode($response, true);
    if($decoded_response['success'] == true)
    {
        
        //send the email.
        
        if (mail($recipient, $subject, $email_content, $email_headers)){
            http_response_code(200);
        echo "Contact Form successfully submitted. Thank you for your enquiry. One of our professional representatives will be in touch soon.";
        }
        else{
            http_response_code(500);
        echo "Whoa! Sorry message could not be sent.";
        }
        else{
            http_response_code(400);
        echo 'Your are a spammer!';
        }
    }
}
?>

HTML

<div class="box">
            <div class="container">
                <div class="row">
                    <form id="contactform" method="post" action="mailer.php">
                    <div class="col-sm-6">
                            <div class="form-group">
                                <label for="name">Name</label>
                                <input type="text" class="form-control" id="name" name="username" placeholder="Enter your name">
                            </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label for="phone">Phone</label>
                            <input type="text" class="form-control" id="phone" name="phone" placeholder="Enter your phone number">
                        </div>
                    </div>
                        
                    <div class="col-sm-12">
                            <div class="form-group">
                                <label for="email">Email</label>
                                <input type="email" class="form-control" id="email" name="email" placeholder="Enter your email address">
                            </div>
                    </div>
                    <div class="col-sm-12">
                            <div class="form-group">
                                <label for="message">Message</label>
                                <textarea class="form-control" id="message" name="message" rows="4" placeholder="Enter your email message"></textarea>
                            </div>
                            <br>
                            <div class="g-recaptcha" data-sitekey="SITEKEY"></div>
                            <br>                    

                            <div id="formresult"> </div>

                            <button type="submit" name="submit" class="btn btn-primary btn-send btn-lg">Submit</button>
                            <button type="reset" class="btn btn-danger btn-send btn-lg">Reset</button>
                        <div class="row">
                            <div class="col-sm-12">
                                <p class="text-muted"><strong>*</strong>Please fill all required form field, thanks!</p>
                            </div>
                        </div>
                    </div>
                        </form>
                        <div class="col-sm-12">
                
                        </div>

                </div>

            </div>
      </div>

<script type="text/javascript">
    $(document).ready(function() {

        $('#contactform').submit(function(event) {
            event.preventDefault();

            var contactform = $('#contactform');
            var formresult = $('#formresult');
            var formdata = $(contactform).serialize();

            $.ajax({
                type: 'POST',
                url: $(contactform).attr('action'),
                data: formdata,

                beforeSend: function() {
                    $(formresult).removeClass();
                    $(formresult).addClass('alert alert-info');
                    $(formresult).html("<span class='glyphicon glyphicon-refresh gly-spin' aria-hidden='true'></span>");
                },
                success:function(response) {
                    $(formresult).removeClass();
                    $(formresult).addClass('alert alert-success');
                    $(formresult).html(response);
                },
                error:function(data) {
                    $(formresult).removeClass();
                    $(formresult).addClass('alert alert-warning');
                    $(formresult).html(data.responseText);
                }
            });

        });


    });
    </script>

Please help with the issue
Thanks
in Advance

I am by no means an Ajax expert, but why are these lines different?

$(formresult).html(response);

and

$(formresult).html(data.responseText);

I can see that you capture the response from your PHP code depending on success or error into two different variables, but I’m not sure why in one you just assign the contents of that variable as response to the html of your response div, but in the other you see the need to split it down into part of the return, as data.responseText. I can’t see that you return stuff in different formats in your PHP, whether it worked or not, so I wondered why you handle the return differently.

I also think that you’ve got a close-brace in the wrong place - I think you should have two closes after the “Whoa! message could not be sent” clause, as you’re closing the else for the return from mail(), and closing the initial if() for whether the captcha was correct.

ETA - does it send the email?

Nevermind my comment for mouse didn’t scroll down properly when reading your comment. :weary:

Hello,

Thanks for reply

Yes the contact form is working i can able to receive emails
Only issue is with the submission messages

This
$(formresult).html(response);
is the user defined return value of success callback from the ajax request. Be it string, JSON or something else.

And here
$(formresult).html(data.responseText)

data is the jqXHR object returned in the error callback of the ajax request which has property called responseText (plus some other properties and methods).

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.