0

I am trying to set up a mail form inside a bootstrap modal window with some JS validation (for antispam purposes). I want the window to stay open after the form has been submitted and display a success/error message there. Even though I'm not familiar with AJAX (I'm still a beginner developer), I have followed some tutorials and came up with a solution that seems to work visually (messages are displayed accordingly and the modal window does not close after submit), but either the form is not being sent (the site is on a production server, not hosted locally) or there's an error somewhere, because I am not receiving any email.

I can't spot where the error is. Can someone help me?

Here is my code.

HTML form

<div class="alert alert-success hidden" id="fSuccess"><?php echo $lang['fsuccess']; ?></div>
<div class="alert alert-danger hidden" id="fError"><?php echo $lang['ferror']; ?></div>
<form id="contactForm" name="contactForm" class="form-horizontal" role="form" method="post" action="form.php">
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label"><?php echo $lang['lname']; ?></label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="name" name="name" placeholder="<?php echo $lang['pname']; ?>" value="" required="required">
        </div>
    </div>
    <div class="form-group">
        <label for="email" class="col-sm-2 control-label"><?php echo $lang['lemail']; ?></label>
        <div class="col-sm-10">
            <input type="email" class="form-control" id="email" name="email" placeholder="<?php echo $lang['pemail']; ?>" value="" required="required">
        </div>
    </div>
    <div class="form-group">
        <label for="tel" class="col-sm-2 control-label"><?php echo $lang['ltel']; ?></label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="tel" name="tel" placeholder="1234567890" value="">
        </div>
    </div>
    <div class="form-group">
        <label for="message" class="col-sm-2 control-label"><?php echo $lang['lmessage']; ?></label>
        <div class="col-sm-10">
            <textarea class="form-control" rows="4" name="message" required="required"></textarea>
        </div>
    </div>
    <div class="form-group">
        <label for="captcha" class="col-sm-2 control-label">2 + 3 = ?</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" name="captcha" placeholder="<?php echo $lang['phuman']; ?>">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-10 col-sm-offset-2">
            <button type="submit" name="submit" id="submit" class="btn btn-default btn-lg"><span class="glyphicon glyphicon-send red" aria-hidden="true"></span>&nbsp;<?php echo $lang['send']; ?></button>       
        </div>
    </div>
</form> 

Form.php

 <?php

    // mail form

        // salvo le variabili

        if (isset($_POST['submit'])) {
            $name = $_POST['name'];
            $email = $_POST['email'];
            $tel = $_POST['tel'];
            $message = $_POST['message'];
            $captcha = $_POST['captcha'];
            $from = $name; 
            $to = 'hidden@yahoo.it'; 
            $subject = 'Richiesta di contatto';

            $body = "Da: $name\n E-Mail: $email\n Tel: $tel\n Messaggio:\n $message";

            // ok, spediamo!

            mail($to, $subject, $body, $from);

        }

    ?>

External javascript file

 $(function () {
    $('#contactForm').on('submit',function (e) {
        var captcha = document.forms["contactForm"]["captcha"].value;
            if (captcha == null || captcha != "5") {
                $("#fError").removeClass("hidden");
                return false;
            } else {
                $.ajax({
                    type: 'POST',
                    url: 'form.php',
                    data: $('#contactForm').serialize(),
                    success: function () {
                        $('#contactForm').each(function(){
                            this.reset();
                        });                    
                        $("#fError").addClass("hidden");
                        $("#fSuccess").removeClass("hidden"); 
                    },
                    error: function(){
                        $("#fError").removeClass("hidden");
                    }
                });
            }        
        e.preventDefault();
    });
});
Samir
  • 1,312
  • 1
  • 10
  • 16
Raffaella
  • 1
  • 1
  • `From:` btw, expects an email, not a name. – Funk Forty Niner Nov 07 '16 at 13:05
  • you have to embedd the class for imap or pop – Blueblazer172 Nov 07 '16 at 13:17
  • First you need to make sure that your PHP script works. If you set all $_POST variables manually and simply open it on a browser, does the email get sent? Also, try `echo mail(...) ? "success" : "failure";` to see if the mail function fails or not. –  Nov 07 '16 at 13:19
  • http://www.w3schools.com/php/func_mail_mail.asp – kiran gadhvi Nov 07 '16 at 13:30
  • Thanks guys. I tested the mail function as Chris suggested and found out that the server my site is hosted on has disabled sending mail with php. I will try another host to see if the code works. Thanks again – Raffaella Nov 08 '16 at 12:13

0 Answers0