У меня есть основная страница регистрации, которая отправляет данные в базу данных SQL. Тем не менее, я бы хотел, чтобы страница не перенаправлялась при отправке (либо успешно, либо нет).
Это то, что у меня сейчас есть, и оно не работает. В нем не отображаются сообщения об ошибках.
HTML – signup.html
<!DOCTYPE html> <html lang="en"> <head> <title>Signup</title> <meta charset="utf-8"> </head> <body> <form> <table> <tbody> <tr> <td> <input type="text" name="first" placeholder="First Name" id="first"> </td> </tr> <tr> <td> <input type="text" name="last" placeholder="Last Name" id="last"> </td> </tr> <tr> <td> <input type="submit" value="Signup" id="signup"> </td> </tr> </tbody> </table> </form> </body> </html> JavaScript – signup.js
function submit() { $("form").submit(function(e) { e.preventDefault(); $.ajax({ type: 'POST', url: 'signup.php', data: $('form').serialize(), success: function() { console.log("Signup was successful"); } error: function() { console.log("Signup was unsuccessful"); } }); } $(document).ready(function() { submit(); });
PHP – signup.php
<?php include_once "db_connect.php"; $post_FirstName = $_POST['first']; $post_LastName = $_POST['last']; $addData = "INSERT INTO details (firstname, lastname) VALUES ('$post_FirstName', '$post_LastName')"; if ($conn->query($addData) === TRUE) { echo "Working"; } else { echo "Not working"; } ?>
Вот JSFiddle .
Надеюсь, вы, ребята, можете помочь. Заранее спасибо 🙂
Если вы используете ajax, вам не нужно использовать тип ввода в качестве button submit .
$(document).ready(function() { $("#signup").click(function(e) { e.preventDefault(); $.ajax({ type: 'POST', url: 'signup.php', data: $('form').serialize() success: function() { console.log("Signup was successful"); } error: function() { console.log("Signup was unsuccessful"); } }); });
Также измените здесь
$post_FirstName = $_POST['first']; // name is `first` not `firstname`
У вас несколько тормозов и скобок закрыты неправильно
function submit() { $("form").submit(function(e) { e.preventDefault(); $.ajax({ type: 'POST', url: 'signup.php', data: $('form').serialize(), success: function() { console.log("Signup was successful"); },//here error: function() { console.log("Signup was unsuccessful"); } });});//here } $(document).ready(function() { submit(); });
Нет необходимости вызывать функцию submit . Только это будет сделано (вы пропустили запятую и закрывающий тег):
<script> $("form").submit(function(e) { e.preventDefault(); $.ajax({ type: 'POST', url: 'signup.php', data: $('form').serialize(), success: function() { console.log("Signup was successful"); }, //You missed this error: function() { console.log("Signup was unsuccessful"); } }); }); //You missed this </script>