bootstrap 3联系表格行为不端

Question

我正在开发一个带有联系表单的网站，为此我选择this codepen example bootstrap 3联系表单并进行验证。 这种形式工作正常但我实现PHP代码并尝试将表单值插入MySQL数据库时发生错误。 问题是当我填写所有字段并尝试提交时，提交按钮已禁用，如发生错误时，但如果我重新提交任何一个值并尝试提交它已完成。我思考并思考但不能解决任何原因。我决定在像你这样的专家面前解决这个问题，因为我不是专家。

到目前为止，我所做的一切都可以在this link现场找到。

我的javascript和php代码如下。

  $(document).ready(function() {
$('#contact_form').bootstrapValidator({
    // To use feedback icons, ensure that you use Bootstrap v3.1.0 or later
    feedbackIcons: {
        valid: 'glyphicon glyphicon-ok',
        invalid: 'glyphicon glyphicon-remove',
        validating: 'glyphicon glyphicon-refresh'
    },
    fields: {
        first_name: {
            validators: {
                    stringLength: {
                    min: 2,
                },
                    notEmpty: {
                    message: 'Please supply your first name'
                }
            }
        },
         last_name: {
            validators: {
                 stringLength: {
                    min: 2,
                },
                notEmpty: {
                    message: 'Please supply your last name'
                }
            }
        },
        pendant_name: {
            validators: {
                 stringLength: {
                    min: 2,
                },
                notEmpty: {
                    message: 'Please supply your pendant name'
                }
            }
        },
        confirm_pendant_name: {
            validators: {
                 stringLength: {
                    min: 2,
                },
                notEmpty: {
                    message: 'Please confirm your pendant name'
                },
            }
        },
        email: {
            validators: {
                notEmpty: {
                    message: 'Please supply your email address'
                },
                emailAddress: {
                    message: 'Please supply a valid email address'
                }
            }
        },
        phone: {
            validators: {
                notEmpty: {
                    message: 'Please supply your phone number'
                },
                phone: {
                    country: 'US',
                    message: 'Please supply a vaild phone number with area code'
                }
            }
        },
        address: {
            validators: {
                 stringLength: {
                    min: 8,
                },
                notEmpty: {
                    message: 'Please supply your street address'
                }
            }
        },
        city: {
            validators: {
                 stringLength: {
                    min: 4,
                },
                notEmpty: {
                    message: 'Please supply your city'
                }
            }
        },
        country: {
            validators: {
                notEmpty: {
                    message: 'Please select your country'
                }
            }
        },
        state: {
            validators: {
                notEmpty: {
                    message: 'Please select your state'
                }
            }
        },
        zip: {
            validators: {
                notEmpty: {
                    message: 'Please supply your zip code'
                },
                zipCode: {
                    //country: 'US',
                    message: 'Please supply a vaild zip code'
                }
            }
        },
        }
    })

    .on('success.form.bv', function(e) {
      $('#success_message').slideDown({ opacity: "show" }, "slow"); // Do something ...

       $('#contact_form').data('bootstrapValidator').resetForm();

        // Prevent form submission
        e.preventDefault();

        // Get the form instance
        var $form = $(e.target);

        // Get the BootstrapValidator instance
        var bv = $form.data('');

        // Use Ajax to submit form data
        $.post($form.attr('action'), $form.serialize(), function(result) {
            console.log(result);
        }, 'json');
});
});

这是我的PHP代码。

<?php
//Establishing Connection with Server
$connection = mysql_connect("localhost", "myusername", "mypassword");

//Selecting Database from Server
$db = mysql_select_db("mydbname", $connection);
if(isset($_POST['submit'])){

//Fetching variables of the form which travels in URL

$first_name = $_POST['first_name'];
$last_name = $_POST['last_name'];
$pendant_name = $_POST['pendant_name'];
$confirm_pendant_name = $_POST['confirm_pendant_name'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$address = $_POST['address'];
$country = $_POST['country'];
$state = $_POST['state'];
$city = $_POST['city'];
$zip = $_POST['zip'];
$query = mysql_query("insert into mytable(first_name, last_name, pendant_name, confirm_pendant_name, email, phone, address, country, state, city, zip) values ('$first_name', '$last_name', '$pendant_name', '$confirm_pendant_name', '$email','$phone', '$address', '$country', '$state', '$city', '$zip' )");
}
//Closing Connection with Server
mysql_close($connection);
?>