0

I was handed the below part of a webpage and a .js file to implement mailing function from the contact form but I can't figure it out. Here is the form code:

                    <form class="contact-form-wrapper"  name="contactForm" id='contact_form' method="post" action='assets/php/mail.php'>
                        <div class="row">
                            <div class="form-group col-md-6">
                                <input type="text" class="form-control" name="name" placeholder="Name">
                            </div>
                            <div class="form-group col-md-6">
                                <input type="email" class="form-control input-email fill-this" name="email" placeholder="Email">
                            </div>
                            <div class="form-group col-md-12">
                                <input type="text" class="form-control" name="subject" placeholder="Subject">
                            </div>
                            <div class="form-group col-md-12">
                                <textarea class="form-control" name="message" rows="3" placeholder="Message"></textarea>
                            </div>
                            <div class="form-group col-md-12">
                                <div id="mail_success" class="success" style="display:none;">
                                    Thank You ! Your email has been delivered.
                                </div>
                                <div id="mail_fail" class="error" style="display:none;">
                                    An error occured, please try again later !
                                </div>
                            </div>
                            <div class="form-group col-md-12" id="submit">
                                <input class="btn btn-md btn-dark" type="submit" id="send_message" value="Submit">
                            </div>
                        </div>
                    </form

And here is the js file:

 $(document).ready(function(){
        $('#send_message').click(function(e){

            // Stop form submission & check the validation
            e.preventDefault();

            // Variable declaration
            var error = false;

            var email = $('.input-email').val();
            var required = $('.fill-this').val();


            if(email.length == 0 || email.indexOf('@') == '-1'){
                var error = true;
                // $('#email_error').fadeIn(500);
                $('.input-email').addClass("validation");

            }else{
                $('.input-email').removeClass("validation");
            }

            if(required.length == 0){
                var error = true;
                $('.fill-this').addClass("validation");
            }else{
                $('.fill-this').removeClass("validation");
            }

            // If there is no validation error, next to process the mail function
            if(error == false){
               // Disable submit button just after the form processed 1st time successfully.
                $('#send_message').attr({'enabled' : 'enable', 'value' : 'Sending...' });
                $message = "wrong answer";
                /* Post Ajax function of jQuery to get all the data from the submission of the form as soon as the form sends the values to email.php*/
                $.post("../php/email.php", $("#contact_form").serialize(),function(result){
                    //Check the result set from email.php file.
                    if(result == 'sent'){
                        //If the email is sent successfully, remove the submit button
                        $message = "wrong answer";
                         $('#send_message').addClass("hidden").attr({'enabled' : 'enable', 'value' : 'send' });
                        //Display the success message
                        $('#mail_success').fadeIn(500);
                    }else{
                        //Display the error message

                        $message = "wrong answer";
                        $('#mail_fail').fadeIn(500);
                        // Enable the submit button again
                        $('#send_message').removeAttr('disabled').attr('value', 'Send The Message');
                    }
                });
            }
        });    
    });

I created a mail.php file with the help of google and this is what I have till now:

<?php

$errors = '';
$myemail = 'darren@prawno.fr';
if(empty($_POST['name'])  || 
   empty($_POST['email']) || 
   empty($_POST['message']))
{
    $errors .= "\n Error: all fields are required";
}

$name = $_POST['name']; 
$email_address = $_POST['email']; 
$message = $_POST['message']; 

if (!preg_match(
"/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/i", 
$email_address))
{
    $errors .= "\n Error: Invalid email address";
}
if( empty($errors))
{
$to = $myemail;
$email_subject = "Contact form submission: $name";
$email_body = "You have received a new message. ".
" Here are the details:\n Name: $name \n ".
"Email: $email_address\n Message \n $message";
$headers = "From: $myemail\n";
$headers .= "Reply-To: $email_address";
mail($to,$email_subject,$email_body,$headers);
header('Location: index.html');

}


?>

The entire thing doesn't seem to work. After I fill up the form and hit send, button says 'Sending..' as per the js file but nothing actually happens. I have only used simple contact forms that did not involve any js or ajax. Any help would be appreciated. Thanks!

Inception
  • 455
  • 1
  • 9
  • 32
  • 1
    You actually have to have a *mail server* to make this work. The PHP docs assume you already know this, which is very confusing to people who don't. – Jared Smith Sep 26 '17 at 14:58
  • 1
    use the network tab of the web inspector to see if any http requests are made, and if any response is returned with a status code 200, 404, 500 etc. add that info to your question – delboy1978uk Sep 26 '17 at 14:59
  • @JaredSmith: Oh ohk. Is there any alternate way to implement mailing through the form without the mail server? – Inception Sep 26 '17 at 15:32
  • @Inception no, you have to have a mail server (or access to one) to send email. You are asking how to drive a car if you don't have access to a car. If you have a normal gmail account it can (IIRC) be configured to send programmatic emails, but doing so is beyond the scope of a SO question/answer. – Jared Smith Sep 26 '17 at 15:34

0 Answers0