Как сохранить введенные данные в браузере при неудачной отправке в базу данных sql, ну или чтоб информация в форме не пропадала после обновления страницы?
3 ответа
В любом случае вариант один - это сохранение информации формы на стороне клиента.
Как вариант, можно использовать jQuery .keyup() в связке с localStorage/sessionStorage(на крайняк можно Cookie).
В примере ниже код с использованием localStorage и библиотеки jQuery.
$(document).ready(function() {
var text = $('#text');
if (localStorage.getItem('text')) text.val(localStorage.getItem('text'));
text.keyup(function() {
localStorage.setItem('text',text.val());
});
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<input type="text" id="text" />
</body>
</html>
Cookies. Делаем событие onKeyup на инпутах и т.д. Сразу записываем в cookies. При обновлении страницы проверяем есть ли кука с значением определенного инпута - если есть то значение инпута присваиваем значению из кука
-
интересный вариант. Только наверное
onBlur
лучше... Хотя это уже от проекта зависит... Но вариант ОЧЕНЬ интересный!– cyadvert30 сен 2015 в 15:39
Для этого существует два варианта.
Более простой, но чуть менее удачный, называется Post/Redirect/Get - выводить данные сразу же по получении. То есть, при "неудачной отправке" просто выводим опять же форму, и в неё вводим полученные значения. после успешного добавления данных, делаем редирект на тот же урл.
пример
if ($_SERVER['REQUEST_METHOD']=='POST') {
// обрабатываем полученные переменные.
// пишем в переменную $err ошибки
} if (!$err) {
save(); // сохраняем редиректим
Header("Location: ".$_SERVER['REQUEST_URI']);
exit;
}
}
// показываем страницу с формой.
// значения заполняем из $_POST
Второй - чуть более сложный, но более корректный с точки зрения юзабилити. Записываем полученные данные в сессию, туда же кладем сообщения об ошибке, делаем редирект, выводим заполненную форму и ошибки.
session_start();
if ($_SERVER['REQUEST_METHOD']=='POST') {
// обрабатываем полученные переменные.
// пишем в переменную $err ошибки
} if ($err) {
$_SESSION['err'] = $err;
$_SESSION['post'] = $_POST;
} else {
save(); // сохраняем редиректим
}
Header("Location: ".$_SERVER['REQUEST_URI']);
exit;
}
if (isset($_SESSION['post'])) {
$err = $_SESSION['err'];
$post = $_SESSION['post'];
unset ($_SESSION['err'], $_SESSION['post']);
}
// показываем страницу с формой.
// значения заполняем из $post
-
Эти два способа не борятся со следующим случаем. Пользователь начинает вводить данные и нажимает F5.– KoVadim30 сен 2015 в 14:21
-
@KoVadim, Можно придумать много возможных случаев. В вопросе конкретно интересует ошибка в валидации данных. Я в своём проекте использовал редирект на страницу с формой. Стираются только пароли. 30 сен 2015 в 14:53
-
ТС написал явно "чтоб информация в форме не пропадала после обновления страницы"– KoVadim30 сен 2015 в 14:55
-
а можете какую-нибудь ссылку с примером по второму способу предоставить? вроде как в поисковике искал везде все размыто написано 30 сен 2015 в 15:17
localStorage
:) htmlbook.ru/html5/storage Работает на стороне клиента, как на этом сайте.