成功提交表单后不会嵌入消息

时间:2015-11-25 15:09:21

标签: javascript php ajax forms

我在我的网站上使用联系表单。一切都很好。除了成功的消息。我想将感谢信息嵌入名为" form-message"的p标签中。但是当我提交表单时,它会将我重定向到另一个页面。我该如何解决这个问题?感谢

      <div class="col-md-6 col-md-6">
      <h3 class="title">Contact Form</h3>
      <p class="form-message">

      </p>
      <div class="contact-form"> 
        <!-- Form Begins -->
        <form role="form" name="contactform" id="contactform2" method="post" action="../../php/contact-form.php">
          <div class="row">
            <div class="col-md-6"> 
              <!-- Field 1 -->
              <div class="input-text form-group">
                <input type="text" name="contact_name" class="input-name form-control"
                                        placeholder="Full Name" />
              </div>
            </div>
            <div class="col-md-6"> 
              <!-- Field 2 -->
              <div class="input-email form-group">
                <input type="email" name="contact_email" class="input-email form-control"
                                        placeholder="Email" />
              </div>
            </div>
          </div>
          <!-- Field 3 -->
          <div class="input-email form-group">
            <input type="text" name="contact_phone" class="input-phone form-control" placeholder="Phone" />
          </div>
          <!-- Field 4 -->
          <div class="textarea-message form-group">
            <textarea name="contact_message" class="textarea-message form-control" placeholder="Message"
                                rows="6"></textarea>
          </div>
          <!-- Button -->
          <button class="btn btn-default" type="submit" name="form_sub">Send Now <i class="icon-paper-plane"></i></button>
        </form>
        <!-- Form Ends -->
      </div>
    </div>

的Javascript

simplecontactForm2: function(){ 
    if ( $( "#contactform2" ).length !== 0 ) {
    $('#contactform2').bootstrapValidator({
            container: 'tooltip',
            feedbackIcons: {
                valid: 'fa fa-check',
                warning: 'fa fa-user',
                invalid: 'fa fa-times',
                validating: 'fa fa-refresh'
            },
            fields: { 
                contact_name: {
                    validators: {
                        notEmpty: {
                            message: ''
                        }
                    }
                },
                contact_email: {
                    validators: {
                        notEmpty: {
                            message: ''
                        },
                        emailAddress: {
                            message: ''
                        },
                        regexp: {
                                regexp: '^[^@\\s]+@([^@\\s]+\\.)+[^@\\s]+$',
                                message: 'The value is not a valid email address'
                        }
                    }
                },
                contact_phone: {
                    validators: {
                        notEmpty: {
                            message: ''
                        }
                    }
                },
                contact_message: {
                    validators: {
                        notEmpty: {
                            message: ''
                        }
                    }
                },
            }
        })  
        .on('success.form.bv', function(e) {
            e.preventDefault();
            var $form        = $(e.target),
            validator    = $form.data('bootstrapValidator'),
            submitButton = validator.getSubmitButton();
            var form_data = $('#contactform2').serialize();
            $.ajax({
                    type: "POST",
                    dataType: 'json',
                    url: "../php/contact-form.php",                 
                    data: form_data,
                    success: function(msg){                     
                        $('.form-message2').html(msg.data);
                        $('.form-message2').show();
                        submitButton.removeAttr("disabled");
                        resetForm($('#contactform2'));                      
                    },
                    error: function(msg){}
             });
            return false;
        });
    }
    function resetForm($form) {

        $form.find(
                'input:text, input:password, input, input:file, select, textarea'
            )
            .val('');

        $form.find('input:radio, input:checkbox')
            .removeAttr('checked')
            .removeAttr('selected');
        $form.find('button[type=submit]')
            .attr("disabled", "disabled");

    }
},

PHP

<?

php
// Information to be modified
$to_email = "mymail@yahoo.com"; //email address to which the form data will be sent
$subject = "Contact Request"; // subject of the email that is sent
$thanks_page = "index.html"; // path to the thank you page following successful form submission
$contact_page = "index.html"; // path to the HTML contact page where the form appears


$nam = strip_tags($_POST["contact_name"]);
$ema = strip_tags($_POST["contact_email"]);
$pho = strip_tags($_POST["contact_phone"]);
$com = strip_tags($_POST["contact_message"]);

$headers  = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
$headers .= 'From: <' .$ema. '>' . "\r\n";
$headers .= "Reply-To: ".$ema."\r\n";

$email_body = 
    "<strong>From: </strong>" . $nam . "<br />
    <strong>Email: </strong>" . $ema . "<br />  
    <strong>Phone: </strong>" . $pho . "<br />  
    <strong>Message: </strong>" . $com;


// Assuming there's no error, send the email and redirect to Thank You page

if( mail($to_email, $subject, $email_body, $headers) ) {    
    $msg_array = array( 'status' => 'true', 'data' => '<i class="glyphicon glyphicon-ok"></i> Thank you ' .$nam. '. Your Email was successfully sent!' );
    echo json_encode($msg_array);

} else {    
    $msg_array = array( 'status' => 'true', 'data' => '<i class="glyphicon glyphicon-remove"></i> Sorry ' .$nam. '. Your Email was not sent. Resubmit form again Please..' );
    echo json_encode($msg_array);   
}

0 个答案:

没有答案