Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.03.2019, 16:28
Интересующийся
Отправить личное сообщение для Volun Посмотреть профиль Найти все сообщения от Volun
 
Регистрация: 24.03.2019
Сообщений: 21

Сохранить состояние
Прошу вашей помощи. На странице есть 2 формы, при заполнении первой по клику она скрывается и появляется вторая форма. Как мне сохранить такое состояние (видимость форм) при перезагрузке страницы или возврате на нее. Код обработчика форм:

$( document ).ready(function() {
    $("#btn_name").click(
		function(){
			sendAjaxForm('form_pass', 'form_name', 'save_user.php');
			return false; 
		}
	);
});
 
function sendAjaxForm(form_pass, form_name, url) {
    $.ajax({
        url:     url,
        type:     "POST", 
        dataType: "html", 
        data: $("#"+form_name).serialize(),  
        success: function(response) { 
        	result = $.parseJSON(response);
        	$('#form_name').hide();
                $('#form_pass').toggle();
    	},
    	error: function(response) { 
            $('#error_message').html('Error message.');
    	}
 	});
}

Последний раз редактировалось Volun, 24.03.2019 в 16:31.
Ответить с цитированием
  #2 (permalink)  
Старый 25.03.2019, 08:14
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,204

Сообщение от Volun
Как мне сохранить такое состояние
На клиенте можно:
- записать в куки
- записать в локальное хранилище

При чтении страницы прочитать. Если есть запись о скрытии - скрыть нужную форму.
Ответить с цитированием
  #3 (permalink)  
Старый 25.03.2019, 10:06
Интересующийся
Отправить личное сообщение для Volun Посмотреть профиль Найти все сообщения от Volun
 
Регистрация: 24.03.2019
Сообщений: 21

Сообщение от ksa Посмотреть сообщение
На клиенте можно:
- записать в куки
- записать в локальное хранилище

При чтении страницы прочитать. Если есть запись о скрытии - скрыть нужную форму.
Да, я пробовал сохранить в localstorage, но что-то никак не получается. Не могли бы вы подсказать как это сделать?
Ответить с цитированием
  #4 (permalink)  
Старый 25.03.2019, 10:21
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,790

Volun, пример работы с localStorage:
https://javascript.ru/forum/misc/769...tml#post504507
Ответить с цитированием
  #5 (permalink)  
Старый 25.03.2019, 10:33
Интересующийся
Отправить личное сообщение для Volun Посмотреть профиль Найти все сообщения от Volun
 
Регистрация: 24.03.2019
Сообщений: 21

Да, спасибо, уже разобрался. Вот код если кому понадобится:

$( document ).ready(function() {
    
var hideName = localStorage.getItem("hideName");
$("#form_name").css("display",hideName);
var showPass = localStorage.getItem("showPass");
$("#form_pass").css("display",showPass);

    $("#btn_name").click(
		function(){
			sendAjaxForm('form_pass', 'form_name', 'save_user.php');
			return false; 
		}
	);
});
 
function sendAjaxForm(form_pass, form_name, url) {
    $.ajax({
        url:     url,
        type:     "POST", 
        dataType: "html",
        data: $("#"+form_name).serialize(),  
        success: function(response) { 
        	result = $.parseJSON(response);
        	$('#form_name').hide();
                $('#form_pass').toggle();
                localStorage.setItem("hideName","none");
                localStorage.setItem("showPass","block");

    	},
    	error: function(response) { 
            $('#error_message').html('Error message');
    	}
 	});
}
Ответить с цитированием
  #6 (permalink)  
Старый 25.03.2019, 12:37
Интересующийся
Отправить личное сообщение для Volun Посмотреть профиль Найти все сообщения от Volun
 
Регистрация: 24.03.2019
Сообщений: 21

Господа, еще такой вопрос. Как мне получить значение поля email из формы #form_name и передать его в скрытое поле hidden_email формы #form_pass ?
Ответить с цитированием
  #7 (permalink)  
Старый 25.03.2019, 15:07
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,204

Сообщение от Volun
поля email из формы #form_name
По форме понятно - ее ИД form_name. Так?
А, что за поле email? Это его ИД?
Показал бы фрагмент html...
Ответить с цитированием
  #8 (permalink)  
Старый 25.03.2019, 15:09
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,204

Сообщение от Volun
и передать его в скрытое поле hidden_email формы #form_pass ?
Когда получишь значение из email, его нужно прописать в поле hidden_email. Это его ИД или что?
После этого вызвать отправку формы #form_pass. Это ИД той формы?

document.getElementById('form_pass').submit();
Ответить с цитированием
  #9 (permalink)  
Старый 25.03.2019, 15:19
Интересующийся
Отправить личное сообщение для Volun Посмотреть профиль Найти все сообщения от Volun
 
Регистрация: 24.03.2019
Сообщений: 21

Вот код обеих форм. Они находятся на одной странице, и по клику первая скрывается, а вторая появляется без перезагрузки страницы.

<form method="post" id="form_name">
<input name="first_name" placeholder="First Name" class="form-control" data-i18n="">
<input  name="last_name" placeholder="Last Name" class="form-control" data-i18n="">
<input  name="email" placeholder="Email" class="form-control" data-i18n="">
<button type="submit" id="btn_name" class="btn-formnav btn"><span data-animation-name="next-span"><span data-i18n="">NEXT</span> &gt;</span></button>
</form><br>

<form method="post" id="form_pass">
<input name="password" placeholder="Password" class="form-control" data-i18n="">
<input  name="pass_conf" placeholder="Confirm Password" class="form-control" data-i18n="">
<input name="hidden_email" class="form-control" data-i18n="" style="display: none;">
<button type="submit" id="btn_pass" class="btn-formnav btn"><span data-animation-name="next-span"><span data-i18n="">NEXT</span> &gt;</span></button>
</form>
Ответить с цитированием
  #10 (permalink)  
Старый 25.03.2019, 15:29
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

В скрипте пост#6 перед 10 или после 10 строки добавить

hidden_email.value = email.value;
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как сохранить состояние клонированного элемента? Ramundo Элементы интерфейса 3 20.08.2018 16:50
Глобальная переменная, которая хранит состояние приложения sniffysko Angular.js 2 25.04.2018 09:13
переход элемента в изначальное состояние miraghyk Элементы интерфейса 5 30.12.2017 23:01
Как вернуть div и все вложенные в него элементы в первоначальное состояние? lucky89 Общие вопросы Javascript 17 26.02.2015 18:41
сохранить состояние страницы Sveta Общие вопросы Javascript 6 25.11.2013 11:09