Как сохранить все что в form после перезагрузки страницы?

element.getAttribute() те задачи что я хочу реализовать можно через данную функцию реализовать?

Попробовал я этот метод.

пример для импута

<input type="text" name="prname" maxlength="80" id="textarea" autofocus check_message="Введите заголовок, должен быть не больше 80 букв" />

так вот после проверки, браузер фаерфокс, показывает окно с ошибками ! а так же предлагает закрыть эти окна если поставить галочку ! если поставить ее то и окна с ошибками не будет видно ! это же минус большой этого метода.

У меня на одном input и на двух textarea стоит этот метод, так вот если забыл ввести заголовок, то всплывает окно, я заполняю, пытаюсь дальше добавить новость, всплывает второе окно, введите короткий текст, опять нажал добавить, всплывает третье окно, заполните полный текст, в третьем окно и появилась поставьте галочку! если ее поставить, и не заполнить поле, а нажать добавить, то новость добавится без полного текста.

Да и окно не совсем красивое, стандартное от брайзера.

Выходит, что эта валидация не совсем хорошая.

Так вот так не делается - через алерты. Алерты на ошибки ввода - явное пренебрежение нормами морали и права.

---------- Добавлено 22.07.2015 в 08:31 ----------

Весь бред комментировать не могу, слишком махровый, вот действующее вещество:

if (!pattern.test(element.value))

значит у нас есть элемент и его видно, правильно? Следовательно можно графически показать что что-то с ним не в порядке, например

if (!pattern.test(element.value)) 

   element.classList.add('invalid');

Стиль надо предусмотреть, например

.invalid{border-color:#a00!important;}

Само собой бордер как таковой у элемента должен быть, но быть или сереньким, или беленьким, или "прозрачным".

Теперь юзер должен понять что он там сделал неправильно, значит дополняем

if (!pattern.test(element.value)) {

   element.classList.add('invalid');

   element.title=check_message;

}

Теперь юзер _увидит_ что поле обвелось красненьким, подведет мышь и прочитает почему.

Чтобы без ховеров - предусмотрите контейнер для вывода ошибок для каждого поля. Скажем под полем ввода нарисуйте

<p id="err-desciption"></p>

Тогда приделав заранее известный префикс к имени поля получите доступ к контейнеру

var err_cont = document.getElementById('err-'+element.name);

err_cont.textContent=error_message;

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

if (!pattern.test(element.value)) 

   element.classList.add('invalid');

if (!pattern.test(element.value)) {

   element.classList.add('invalid');

   element.title=check_message;

}

var err_cont = document.getElementById('err-'+element.name);

err_cont.textContent=error_message;

код который вы написали добавить к тому коду? или заменить какие тополя, я вот не понимаю и спрашиваю ! или удалить весь, но оставить то что вы предложили из кусков кода собрать один.

Кроме того вы же могли поискать готовые библиотеки, в том числе на любимой народом жиквере говорят есть какая-то. Слова js form validation library Вот пример первой из выдачи http://parsleyjs.org/doc/examples/simple.html - как видите по тегам формы подход такой же. Только без паттернов и скорее всего его лайба будет тридцать килограмм и сотню километров как они все эти профи очень любят делать.

Сейчас уже встроенную валидацию можно юзать, нормально поддерживается http://caniuse.com/#feat=form-validation а там где не поддерживается - сработает браузер и все.

Короче, я не могу за вас писать эту штуку, а сами вы не осилите. Попробуйте найти что-то готовое, можно и на русском искать. Кстати у вас там фреймворк или что? В нем разве нет?

ЗЫ Кстати на сайте на любом можно утырить, это же скрипт, он весь в браузере.

да я ставил что то готовое, там все равно нужно переписывать под свои нужды, сколько денег возьмете что бы нормальный код написать?

по первой ссылке, там форма, там нет js.

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

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

вот хорошее решение, то что я хотел что бы через див выводилась валидация я сделал, делюсь !

<script type='text/javascript'>

function checkForm(obj, elems) {

var element, pattern;

for (var i = 0; i < obj.elements.length; i++) {// пробегаемся по всем элементам формы

element = obj.elements;
// Проверяем только нужные поля
if (elems != undefined)
if (elems.join().indexOf(element.type) < 0) continue;
// И только если есть чего говорить юзеру в случае ошибки
if (!element.getAttribute("check_message")) continue;
if (pattern = element.getAttribute("check_pattern")) { // если задан рег
pattern = new RegExp(pattern, "g");
if (!pattern.test(element.value)) {

document.getElementById('validationka').style.display = "block"
document.getElementById('validationka').innerHTML =element.getAttribute("check_message");

element.focus();
return false;
}
} else if(/^\s*$/.test(element.value)) {// иначе просто проверка что поле не пустое


document.getElementById('validationka').style.display = "block"
document.getElementById('validationka').innerHTML = element.getAttribute("check_message");

element.focus();
return false;
}
}
return true;
}
</script>

Да, можно свою мессагу рендерить, причем с клювиком типа вот отседова ошибка произошла. То есть когда юзер жмет кнопку отправить и находится ошибка, вылезает плашка у неправильного поля с текстом что там неправильно.

Кстати на яваскрипт.ру была похожая тема, я скопирую и сюда:

var FormField=function(el){

	var	type=		el.type,
		value=	el.value.trim(),
		pat=		el.getAttribute('pattern'),
		req=		el.getAttribute('required'),
		err=		el.getAttribute('errmsg')+"\n"+el.getAttribute('placeholder'),
		rules={
			'text':function(){
				var len=value.length;
				if(req && len<req)
					throw 'Минимальное количество знаков: '+req;
				else if(len && pat && !new RegExp(pat).test(value))
					throw err;
			},
			'select-one':function(){
				if(el.selectedIndex<0 && req)
					throw 'Необходимо выбрать из списка';
			},
			'select-multiple':function(){
				var mul=el.getAttribute('multiple'),
				for(var count=0, i=0; i<el.length; i++)
					if(el.selected)
						count++;
				if(req && count<req)
					throw 'Необходимо выбрать не меньше чем '+req;
				else if(mul && count>mul)
					throw 'Можно выбрать не больше чем '+mul;
			}
		};

	return {
		el:el,
		error:null,
		title:el.title,
		validate:function() {
			if(type in rules)
				rules[type]();
			else
				rules.text();
		}
	};
};

Как видите функция возвращает объект внутри которого любое поле ввода кроме чека и радио и файлов еще. Этот объект умеет сам себя проверять. Плохая проверка выкидывает исключение, которое ловится и рендерится в "контроллере":

var fields={}, /* здесь все те самые поля-объекты */

validate=function(e) { /* эта функция вешается на всякие там события у полей */

	var f=fields[this.name];

	/* если была, то предыдущая ошибка сбрасывается перед проверкой */

	if(f.error) {
		f.el.title=f.title;
		f.el.classList.remove('invalid');
		f.error=null;
	}
	
	try {
		f.validate();
	}
	catch(err) {
		
		submit.disabled=f.error=true; /* кнопка не оживет пока есть хоть 1 ошибка */

		/* рендерит ошибку если сработало по событию, по вызову из скрипта не рендерит */		
		if(e.type!='input') { 
			f.title=f.el.title;
			f.el.title=err;
			f.el.classList.add('invalid');
		}
	}
},

Теперь если перебрать все поля формы и повесить на change и keyup функцию validate и одновременно запихать которые нужно проверять в массив, то получится приложение.