Остановка перенаправления страницы при отправке формы - PullRequest
0 голосов
/ 12 июня 2018

Я просмотрел много уроков и покопался здесь, но не нашел ничего, что решало бы мою конкретную проблему.Я предполагаю, что у меня есть синтаксическая ошибка или логическая ошибка где-то в моем коде.Моя проблема в том, что всякий раз, когда я отправляю форму, меня направляют на страницу test.php.PHP работает правильно, так как он возвращает правильный результат, но я просто хочу, чтобы он запускался и отображал поданную информацию формы внизу.Любая помощь будет принята с благодарностью.

index.html

<html>
<head>
<title>Computer swap form</title>
</head>
<body>
<form method = "post" action = "test.php" id="computerForm">
Serial Number: <br>
<input name="serialnumber" type="text">

<button id = "sub"> Submit </button>
</form>
<!--display the response returned after form submit -->
<span id ="result"></span>

<script type="text/javascript" src = "https://code.jquery.com/jquery-3.3.1.min.js"></script>

<script src="script/my_script.js" type="text/javascript"></script>

</body>
</html>

test.php

<?php

$sn = $_POST['serialnumber'];

if(!isset($sn))
{
    echo "error serial number not set";
}
else {
    echo "$sn successfully saved";
}
?>

my_script.js

$("#sub").click( function() {
 $.post( $("#computerForm").attr("action"), 
         $("#computerForm").serialize(), 
         function(info){ $("#result").html(info); 
   });
});

$("#computerForm").submit( function() {
  return false; 
});

1 Ответ

0 голосов
/ 12 июня 2018

Чтобы достичь того, что вам требуется, поместите всю свою логику в обработчик submit и вызовите preventDefault() для аргумента события, предоставленного функции обработчика:

$("#computerForm").submit(function(e) {
  e.preventDefault();
  $.post(this.action, $(this).serialize(), function(info) {
    $("#result").html(info);
  });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...