Есть небольшой проект по регистрации и авторизации на PHP. Пытаюсь реализовать отправку формы с Ajax. Пример входа в кабинет. Запросы обрабатываются роутером (Router.php) Он перенаправляет на нужный контроллер (например UserController.php). Тот в свою очередь обрабатывает запрос, передает данные в model (user.php) и в случае успеха перенаправляет в cabinet (index.php). user/login.php PHP: <?php include ROOT . '/views/layouts/header.php'; ?> <section> <div class="container"> <div class="row"> <div> <p align="center"><?php echo $userError; ?></p> <div align="center" class="signup-form"> <h3>Вход на сайт</h3> <form id="form-signin" method="post"> <a><?php echo $log6; ?></a> <p><input id="login" type="text" name="login" placeholder="Login" value="<?php echo $login; ?>"/><p> <p><input id="password" type="password" name="password" placeholder="Пароль" value="<?php echo $password; ?>"/></p> <!-- <input id="submit" type="submit" name="submit" class="btn1"> --> <button class="btn btn-primary" type="button" id="submit" name="submit">Вход</button> </form> <p id="hello">.</p> </div> </div> </div> </div> </section> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <script src="/template/js/main.js"></script> </body> </html> template/js/main.js Код (Javascript): $(document).ready(function() { $("#submit").click(function() { var params = { login: $.trim($("#login").val()), password: $.trim($("#password").val()), } $.ajax({ type: 'POST', url: "", // contentType: 'application/json;charset=UTF-8', data: params, success: function() { console.log("OK"); }, // dataType: "json" }); }); }); После отправки формы c валидными данными (нажав на кнопку "Вход") В системе вход в кабинет происходит, а на странице не происходит ничего. Если обновить страницу вручную, то heder обновляется (видно имя пользователя), а страница так и остается "страница входа" (login.php)? а не "страница кабинета" (cabinet/index.php). должно быть Подскажите пожалуйста что я делаю не так. Спасибо.
Ну аджаск сам на другую страничку переходить не будет. Дождаться успешного выполнения и перейти через location.href.
Спасибо. Добавил в success "window.location.href = '/cabinet'; теперь при валидных данных переходит в кабинет и отображает его. Но: 1. В devtools -> network Fetch/XHR запрос на третьсекунды появляется и сразу исчезает. (Не могу проверить какие данные переданы и получены. 2. При не валидных данных не появляются ошибки. Просто ничего не происходит. С чем это может быть связано? Может быть мне в $.ajax({ .... нужно url: 'какой-то указать?'
Ну так откуда браузер знает, что должно происходить? Это тоже запрограммировать надо Ну ты же на другую страничку переходишь, всё-таки. Можно не переходить, но не уверен, что ты сам потянешь такое запрограммировать. Вот все современные фронт-технологии аля Ангуляр, Вью, Реакт и прочие посвящены как раз тому, чтоб не переходить --- Добавлено --- На ваниле или jquery тоже можно запрограммировать, в принципе. Но тут надо подзамарочиться. Или поискать либу, был такой проект pjax, например
У меня проверка ошибок запрограммирована в контроллере и модельке PHP: <?php /** * Контроллер UserController */ class UserController { /** * Action для страницы "Регистрация" */ public function actionRegister() { //Переменные для ошибок в форму $log6 = ""; $logUse = ""; $pass6 = ""; $passData = ""; $passConflict = ""; $emailIncorrect = ""; $emailUse = ""; $nameLength = ""; $reg = ""; $logSpace = ""; $nameSpace = ""; $passChar = ""; $nameLengthMax =""; // Переменные для формы $login = false; $password = false; $confirmPassword = false; $email = false; $name = false; $result = false; // Обработка формы if (@$_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest') { if (isset($_POST['submit'])) { // Если форма отправлена // Получаем данные из формы $login = $_POST['login']; $password = $_POST['password']; $confirmPassword = $_POST['confirmPassword']; $email = $_POST['email']; $name = $_POST['name']; // Флаг ошибок $errors = false; // Валидация полей if (!User::checkLogin($login)) { $errors[] = 'Login не должен быть короче 6-ти символов'; $log6 = 'Login не должен быть короче 6-ти символов'; } if (!User::checkSpaceLogin($login)) { $errors[] = 'Login не должен содержать пробелы'; $logSpace = 'Login не должен содержать пробелы'; } if (!User::checkUserLogin($login)) { $errors[] = 'Такой Login уже используется'; $logUse = 'Такой Login уже используется'; } if (!User::checkPassword($password)) { $errors[] = 'Пароль не должен быть короче 6-ти символов'; $pass6 = 'Пароль не должен быть короче 6-ти символов'; } if (!User::checkDataPassword($password)) { $errors[] = 'Пароль должен содержать буквы и цифры'; $passData = 'Пароль должен содержать буквы и цифры'; } if (User::checkCharsPassword($password)) { $errors[] = 'Пароль не должен содержать спец символы'; $passChar = 'Пароль не должен содержать спец символы'; } if (!User::checkConfirmPassword($password, $confirmPassword)) { $errors[] = 'Пароли не совпадают'; $passConflict = 'Пароли не совпадают'; } if (!User::checkEmail($email)) { $errors[] = 'Неправильный email'; $emailIncorrect = 'Неправильный email'; } if (!User::checkEmail2($email)) { $errors[] = 'Неправильный email'; $emailIncorrect = 'Неправильный email'; } if (!User::checkUserEmail($email)) { $errors[] = 'Такой Email уже используется'; $emailUse = 'Такой Email уже используется'; } if (!User::checkSpaceName($name)) { $errors[] = 'Login не должен содержать пробелы'; $nameSpace = 'Login не должен содержать пробелы'; } if (!User::checkName($name)) { $errors[] = 'Имя не должно быть короче 2-х символов'; $nameLength = 'Имя не должно быть короче 2-х символов'; } if (!User::checkNameMax($name)) { $errors[] = 'Имя не должно быть длинее 25-х символов'; $nameLengthMax = 'Имя не должно быть длинее 25-х символов'; } if ($errors == false) { // Если ошибок нет // Регистрируем пользователя $result = User::register($login, $password, $confirmPassword,$email, $name); $reg = "Вы зарегистированы!"; } } } // Подключаем вид require_once(ROOT . '/views/user/register.php'); return true; } /** * Action для страницы "Вход на сайт" */ public function actionLogin() { //Переменные для ошибок в форму $userError = ""; $log6 = ""; $pass6 = ""; $success = ""; $user = ""; // Переменные для формы $login = false; $password = false; if (@$_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest') { // Обработка формы if (isset($_POST['login'])) { // Если форма отправлена // Получаем данные из формы $login = $_POST['login']; $password = $_POST['password']; // Флаг ошибок $errors = false; // Валидация полей if (!User::checkLogin($login)) { $errors[] = 'Login не должен быть короче 6-ти символов'; $log6 = 'Login не должен быть короче 6-ти символов'; } // Проверяем зарегистрирован ли пользователь $userId = User::checkUserData($login, $password); if ($userId == false) { // Если данные неправильные - показываем ошибку $errors[] = 'Неправильные данные для входа на сайт'; $userError = 'Неправильные данные для входа на сайт'; } else { $_SESSION['user'] = $login; $success = "Hello "; // // Перенаправляем пользователя в закрытую часть - кабинет header("Location: /cabinet"); } } } else { // Подключаем вид require_once(ROOT . '/views/user/login.php'); return true; } } /** * Удаляем данные о пользователе из сессии */ public function actionLogout() { // Удаляем информацию о пользователе из сессии unset($_SESSION["user"]); // Перенаправляем пользователя на главную страницу header("Location: /"); } } тут и переход есть в кабинет. Model/User.php получает данные и обрабатывает. Извини, что столько кода сюда засунул. У меня без ajax все работало. А теперь что-то не клеится. Задача такая: - Проверить отправку формы с использованием AJAX [при отправке формы страница не должна перезагружаться, в devtools во вкладке network можно увидеть фоновый запрос и его ответ] - Проверить соответствие ответа формату JSON [code + devtools]
Браузеру по барабану. Тут два варианта - либо ты не отправляешь ажаксом, а просто сабмитишь в браузере с перезагрузкой страницы, и тогда то, что ты там нагенерил на пыхе, выводится само, либо с ажаксом выводишь то, что надо, средствами js. Другого не дано
Понял, спасибо. Только уточни еще, мне в js перенести только обработку ошибок и перенаправление или все, что есть в файлах UserController.php и User.php?