Что заставляет данные быть вставленными более двух раз в БД?

Question

Моя форма продолжает вставлять данные формы более двух раз в мою базу данных.
Я не могу понять, почему?

Это код PHP

public function doQuery($sql){
  $this->_reuslt = mysqli_query($this->_conn, $sql);
  $this->_numRows = $this->_reuslt->num_rows;
}

function insert($data){
        $dbo = database::getInstance();
        $sql = "INSERT INTO ".$this->_table." (";
        $sql .= implode(", ", array_keys($data)) . ') VALUES (';
        $sql .= "'" . implode("', '", array_values($data)) . "')";
        $dbo->doQuery($sql);
  }

PHP INАКЦИЯ

if(empty($validate->message)) {
        $data = array(
              'userFname'       => $_POST['firstname'],
              'userLname'       => $_POST['lastname'],
              'userEmail'       => $_POST['email'],
              'userPsw'         => $_POST['password'],
        );
        $user->insert($data);
}

А это JS

$(document).ready(function(){
      $("#create_account").on("submit", function(event){
            event.preventDefault();
            var that = $(this);
            var firstname = $("#firstname").val();
            var lastname = $("#lastname").val();
            var email = $("#email").val();
            var password = $("#password").val();
            var re_password = $("#re_password").val();
            var create_accountSbm = $("#create_accountSbm").val();
            $("#return_new_Account").load('/blog/form', {
                  firstname:firstname,
                  lastname:lastname,
                  email:email,
                  password:password,
                  re_password:re_password,
                  create_accountSbm:create_accountSbm

            });
      });
});

Answer 1

Здесь у нас есть две формы, с остановкой распространения событий и без нее.Проверьте, что происходит в каждом случае:

$(document).ready(function() {

  $("input").on("click", console.clear);

  $("#form1").on("submit", function(e) {
    e.preventDefault();
  });

  $("#form2").on("submit", function(e) {
    e.preventDefault();
    e.stopPropagation();
  });

  $("form, div, body").on("submit", function(e) {
    console.log(this);
  });

  $(document).on("submit", function() {
    console.log('reached document');
    return false;
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="some-div">

  <form id="form1">
    <input type="submit" name="s1" value="Save-1">
  </form>

  <form id="form2">
    <input type="submit" name="s2" value="Save-2">
  </form>

</div>

Answer 2

Как предлагается в одном из комментариев - вы должны остановить распространение действия submit.Вы также можете создать обычную кнопку (не вводить тип отправки) - так будет работать только ваш код.Прямо сейчас вы делаете один вызов из своего кода JS, и form.submit инициирует второй вызов по URL, указанному в поле action формы.