帶有電子郵件提交的HTML和PHP聯系人表格

Question

Db連接

$server     = 'localhost:8080';
$username   = 'root';
$password   = '';
$database   = 'resort';
$connect    = mysqli_connect($server, $username, $password ) or die(mysqli_error.'error connecting to db');

//select database
mysqli_select_db ($database, $connect) or die(mysqli_error.'error selecting db');

if(!empty($_POST)){
    $name = $_POST['name'];
    $email      = $_POST['email'];
    $phone      = $_POST['phone'];
    $message    = $_POST['message'];
    $filtered_email = filter_var($email, FILTER_VALIDATE_EMAIL);

    if(!empty($name) && !empty($email) && !empty($message))
    {
      //insert the data into DB
      mysql_query("INSERT into contactform (contact_id, contact_name, contact_email, contact_phone, message )
                VALUES ('', '".$name."',
               '".$email."', '".$phone."',
               '".$message."' )") or die(mysqli_error());

        //prepare email headers
        $headers = "MIME-Version: 1.0\r\n";
        $headers .= "Content-type: text/html; charset=isoo-8859-1\r\n";
        $headers .= "From: ".$email."\r\n";
        $to = 'mahesh.gulve004@gmail.com,'.$email;
        $subject = 'Contact Form';
        $body       = 'From: <br/> Name: '.$name.' <br/>E-mail: '.$email.'<br/>Phone: '.$phone.'<br/>Message: '.$message;

         //before sending the email make sure that the email address is correct
        if ( $filtered_email == false ) {
            echo json_encode(array(
                'error' => true,
                'msg'   => "The email address entered it's not correct!"
            ));
            exit;
        }
        $mail       = mail($to, $subject, $body, $headers);

        //finally send the email
        if ( $mail ) {
            //finally send the ajax response
            echo json_encode(array(
                'error' => false
            ));
            exit;
        } else {
            //finally send the ajax response
            echo json_encode(array(
                'error' => true,
                'msg'   => "Opss...Something went wrong. Message was not sent!"
            ));
            exit;
        }
    } else {
        echo json_encode(array(
            'error' => true,
            'msg'   => "You haven't completed all required fileds!"
        ));
        exit;
   }
}

 $(function() { //CONTACT FORM AJAX SUBMIT $('#send').click(function() { $.ajax({ url: 'mailer.php', type: 'POST', dataType: 'json', data: $(this).serialize(), success: function(data) { console.log(data); if (data.error === true) { $('#error').css('display', 'block'); var error = document.getElementById('error'); error.innerHTML = data.msg; setTimeout(function() { window.scrollTo(0, 1); }, 100); } else { $('#note').show(); $('#error').hide(); $("#fields").hide(); } } }); return false; }); }); 

 <div class="col-md-6"> <div id="test-form" class="white-popup-block mfp-hide" style="width:400px;float:left;"> <div id="formcontent"> <div id="formheader" style="border-bottom:1px solid #e3e3e3;margin-bottom:20px;"> <h1 style="color:#37bc9b;font-size:33px;">We will get back to you...</h1> </div> <fieldset style="border:0;"> <div id="note"> <h2>Message sent successfully!</h2> </div> <div class="contact-form"> <form id="contactForm" method="post" action=""> <div class="form-group"> <label for="name">Name</label> <span id="name-info" class="info"> <input type="text" placeholder="" id="name" name="name" class="form-control demoInputBox"> </div> <div class="form-group"> <label for="email">Email</label> <span id="email-info" class="info"> <input type="text" placeholder="" id="email" name="email" class="form-control demoInputBox"> </div> <div class="form-group"> <label for="phone">Phone</label> <span id="phone-info" class="info"> <input type="text" id="phone" name="phone" class="form-control demoInputBox"> </div> <div class="form-group"> <label for="message">Message</label> <span id="message-info" class="info"> <textarea placeholder="" rows="5" id="message" name="message" class="form-control demoInputBox"> </textarea> </div> <input class="btn btn-info" id="send" type="submit" value="Submit"/> </form> </div> </fieldset> </div> </div> </div> <div id="error"></div> 

問題是，當我單擊“提交”時，實際上並沒有提交數據，單擊“提交”按鈕不會說什么都不會發生。 錯誤不會發生，因此無法找出問題所在。 我正在嘗試建立可以發送郵件的聯系表格。 因此，您還將獲得一些與此相關的代碼。

Answer 1

要提交表格，您應該使用：

 $('#contactForm').submit(function(){

    //your ajax function

     return false;

});

Answer 2

嘗試$（“＃contactForm”）。serialize（）代替$（this）.serialize（）