Решение для отправки формы ajax - PullRequest
0 голосов
/ 05 августа 2020

У меня есть регистрационная форма в bootstrap модальном окне, я хочу отправить его и проверить, чтобы отображались ошибки без перезагрузки страницы (потому что модальное окно закрывается). Кто-нибудь может подсказать решение? Я пробовал много вариантов, но все равно не работал. Вот мой код, который работает, но не идеально, он отправляет, но все же перезагружает страницу.

<div class="modal fade" id="myModal1">
    <div class="modal-dialog">
        <div class="modal-content">

            <!-- Modal Header -->
            <div class="modal-header">
                <h4 class="modal-title">Registration</h4>
                <button type="button" class="close" data-dismiss="modal">×</button>
            </div>

            <!-- Modal body -->
            <div class="modal-body">

                <form id="regform" method="post" action="#">
                    <?php include('errors.php') ?>
                    <div class="input-group">
                        <label>Username</label>
                        <input id="name" type="text" name="username" value="<?php echo $username; ?>">
                    </div>
                    <div class="input-group">
                        <label>Email</label>
                        <input id="email" type="email" name="email" value="<?php echo $email; ?>">
                    </div>
                    <div class="input-group">
                        <label>Password</label>
                        <input id="pass1" type="password" name="password_1">
                    </div>
                    <div class="input-group">
                        <label>Confirm password</label>
                        <input id="pass2" type="password" name="password_2">
                    </div>
                    <div class="input-group">
                        <button type="submit" class="btn" name="reg_user">Register</button>
                    </div>
                    <p>
                        Already a member? <a href="login.php">Sign in</a>
                    </p>
                </form>
                
                <script>
                    $(document).ready(function() {
                        $("#submit").click(function() {
                            var name = $("#name").val();
                            var email = $("#email").val();
                            var password1 = $("#pass1").val();
                            var password2 = $("#pass2").val();
                            // Returns successful data submission message when the entered information is stored in database.
                            var dataString = 'name1=' + name + '&email1=' + email + '&password11=' + password1 + '&password22=' + password2;
                            if (name == '' || email == '' || password1 == '' || password2 == '') {
                                alert("Please Fill All Fields");
                            } else {
                                // AJAX Code To Submit Form.
                                $.ajax({
                                    type: "POST",
                                    url: "server.php",
                                    data: dataString,
                                    cache: false,
                                    success: function(result) {
                                        alert(result);
                                    }
                                });
                            }
                            return false;
                        });
                    });
                </script>
            </div>
        </div>
    </div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...