jqBootstrapValidation是网站联系表单上的未定义错误

时间:2016-04-27 00:09:15

标签: javascript php ajax forms contact

我一直在弄乱这个联系表格,感觉就像现在一样永远,我无法破解这个错误信息。我通过网站提交了一份联系表格,我一直收到这个错误:

$('#contact-form').find('input,textarea').jqBootstrapValidation is not a function. (In '$('#contact-form').find('input,textarea').jqBootstrapValidation', '$('#contact-form').find('input,textarea').jqBootstrapValidation' is undefined)

以下是资产的代码段:

HTML

<!-- CONTACT FORM -->
            <div class="col-md-7 col-md-offset-1 text-left wow fadeInLeft" data-wow-duration="1s">
                <form id="contact-form" role="form" novalidate="" class="contact-form">

                    <div class="form-group">
                        <input type="text" id="cname" name="cname" required="" class="form-control" placeholder="Name" data-validation-required-message="Please enter your name.">
                    </div>

                    <div class="form-group">
                        <input type="email" id="cemail" name="cemail" required="" class="form-control" placeholder="Email" data-validation-required-message="Please enter your email.">
                    </div>

                    <div class="form-group">
                        <input type="text" id="csubject" name="csubject" required="" class="form-control" placeholder="Subject" data-validation-required-message="Please enter your subject.">
                    </div>

                    <div class="form-group">
                        <textarea id="cmessage" required="" class="form-control" rows="5" placeholder="Message" data-validation-required-message="Please enter your message."></textarea>
                    </div>

                    <div class="submit">
                      <button type="submit" class="pull-left send-button button">Submit</button>
                  </div>
                </form>

                <!-- Ajax response -->
                <div id="contact-response" class="ajax-response font-alt"></div>

            </div>
              <!-- END CONTACT FORM -->

之前的JS文件

  <!-- js files -->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/custom.js"></script>
<script type="text/javascript" src="js/jqBootstrapValidation.js"></script>
<script type="text/javascript" src="js/contact.js"></script>
<script type="text/javascript" src="js/retina.js"></script>
<script src="js/vendor/jquery-1.10.2.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/wow.min.js"></script>
<script src="js/prettyPhoto.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/custom.js"></script>
<script src="js/main.js"></script>
<script src="js/fluid-width.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

.jqBootstrapValidation.js

相当长,所以我不会包括那个 contact.js文件:

(function($){

    $(document).ready(function() {

        /* ---------------------------------------------- /*
         * Contact form ajax
        /* ---------------------------------------------- */

        $('#contact-form').find('input,textarea').jqBootstrapValidation({
            preventSubmit: true,
            submitError: function($form, event, errors) {
                // additional error messages or events
            },
            submitSuccess: function($form, event) {
                event.preventDefault();

                var submit          = $('#contact-form submit');
                var ajaxResponse    = $('#contact-response');

                var name            = $("input#cname").val();
                var email           = $("input#cemail").val();
                var subject            = $("input#csubject").val();
                var message         = $("textarea#cmessage").val();

                $.ajax({
                    type: 'POST',
                    url: 'contact.php',
                    dataType: 'json',
                    data: {
                        name: name,
                        email: email,
                        subject: subject,
                        message: message,
                    },
                    cache: false,
                    beforeSend: function(result) {
                        submit.empty();
                        submit.append('<i class="fa fa-cog fa-spin"></i> Wait...');
                    },
                    success: function(result) {
                        if(result.sendstatus == 1) {
                            ajaxResponse.html(result.message);
                            $form.fadeOut(500);
                        } else {
                            ajaxResponse.html(result.message);
                        }
                    }
                });
            }
        });

    });

})(jQuery);

contact.php文件:

<?php

    // Mail settings
    $to      = "info@aerialimageryhd.com";
    $subject = "Contact Inquiry";

    // You can put here your email
    $header = "From: noreply@aerialimageryhd.com\r\n";
    $header.= "MIME-Version: 1.0\r\n";
    $header.= "Content-Type: text/plain; charset=utf-8\r\n";
    $header.= "X-Priority: 1\r\n";

    if (isset($_POST["name"]) && isset($_POST["email"]) && isset($_POST["subject"]) && isset($_POST["message"])) {

        $content  = "Name: "     . $_POST["name"]    . "\r\n";
        $content .= "Email: "    . $_POST["email"]   . "\r\n";
        $content  = "Subject: "     . $_POST["subject"];
        $content .= "Message: "  . "\r\n" . $_POST["message"];

        if (mail($to, $subject, $content, $header)) {

            $result = array(
                "message"    => "Thanks for contacting us. We will get back shortly.",
                "sendstatus" => 1
            );

            echo json_encode($result);

        } else {

            $result = array(
                "message"    => "Sorry, something is wrong.",
                "sendstatus" => 0
            );

            echo json_encode($result);

        }

    }

?>

0 个答案:

没有答案