Вход

Просмотр полной версии : Скрытие формы

artwalek
02.12.2009, 15:45
Друзья, подскажите пожалуйста.

Мне нужно, когда при клике на <input type="Save" id="Save" name="submit" value="Сохранить" />, форма скрывалась (display: none).

Вместо формы загружалась бы некая ссылка при клике на которую, загружалась бы снова начальная форма и действовал бы этот механизм при последующих загрузках страницы, т.е. не односессионный.

Реализовать только через куку можно?

Спасибо.
Zend
02.12.2009, 19:27
<a href="#" onclick="form_show()">Отобразить форму</a>


<form id="my_form" action="#" method="get">
<fieldset>
<input type="text" name="t1" id="txt1"/>
<input type="text" name="t1" id="txt2"/>
<input type="button" value="Сохранить" onclick="form_close()"/>
<input type="button" value="Сбросить" onclick="form_reset()"/>
</fieldset>
</form>

<style type="text/css">
#my_form {
display: none;
}
</style>



// Функция получения ссылки на элемент по ID
function get(id) {
return document.getElementById(id);
}

// Функция установки куков (обязательные параметры name, value)
function setCookie (name, value, expires, path, domain, secure) {
document.cookie = name + "=" + escape(value) +
((expires) ? "; expires=" + expires : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
((secure) ? "; secure" : "");
}

// Функция чтения значения куков
function getCookie(name) {
var cookie = " " + document.cookie;
var search = " " + name + "=";
var setStr = null;
var offset = 0;
var end = 0;
if (cookie.length > 0) {
offset = cookie.indexOf(search);
if (offset != -1) {
offset += search.length;
end = cookie.indexOf(";", offset)
if (end == -1) {
end = cookie.length;
}
setStr = unescape(cookie.substring(offset, end));
}
}
return(setStr);
}

// Скрытия формы
function form_close() {
setCookie("txt1", get("txt1").value);
setCookie("txt2", get("txt2").value);
get("my_form").style.display = "none";
}

// Функция отображения формы
function form_show() {
if ( getCookie("txt1") != null && getCookie("txt1") != null ) {
get("txt1").value = getCookie("txt1");
get("txt2").value = getCookie("txt2");
}

get("my_form").style.display = "block";
}

// Функция удаления куков путём установки времени жизни на 1970 год
function form_reset() {
setCookie("txt1", "", "Mon, 01-Jan-1970 00:00:00 GMT");
setCookie("txt2", "", "Mon, 01-Jan-1970 00:00:01 GMT");
}


Я молодец. + не забываем.
artwalek
03.12.2009, 09:25
Zend, благодарю.
Вечером погляжу.

Вам большое спасибо.
wiggum
31.01.2012, 21:16
Подскажите как сделать, что бы поле для ввода текста появлялось при выборе из выпадающего списка "Другое..." и пропадало при выборе чего то другого?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>title</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<style type="text/css">
.text-box {
display: none;
}
</style>
<script type="text/javascript" >
(function($) {
$(document).ready( function() {

$('[name="toggle"]').bind('change', function() {
$('.text-box').toggle( $(this).val() );
});

});
})(jQuery)
</script>
</head>

<body>
<form id="form" action="" method="post">
<select id="toggle_hide" type="select" name="toggle">
<option value="t1" id="toggle_hide" type="select" name="toggle" >Опция №1</option>
<option value="t2" for="toggle_hide" id="toggle_hide" type="select" name="toggle" >Опция №2</option>
<option value="t3" for="toggle_hide" id="toggle_hide" type="select" name="toggle" >Опция №3</option>
<option value="t4" id="toggle_show" name="toggle" >Другое...</option>
</select>

<div class="text-box"><input type="text" name="text" value="Другое"></div>
</form>
</body>
</html>