Добавление скрытых полей в форму для обратной связи(без php, jQuery)
Всем привет! Имеется форма обратной связи с проверкой полей
<meta http-equiv="Content-Type" content="text/html; charset="utf-8">
<head>
<html>
<script language="JavaScript">
function check(form)
{
if((form.name.value=="")||(form.theme.value=="")||(form.message.value=="")||(form.e_mail.value==""))
{
alert("Вы заполнили не все поля!");
return false;
}
else
return true;
}
</script>
</head>
<script language="javascript">
function checkEmail(inputvalue){
var pattern=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
if(pattern.test(inputvalue))
{
return true;
}
else
{
alert("Вы неверно заполнили поле E-mail!");
return false;
}
}
</script>
<body>
<form name="contacts" method="POST" action="mailto:example@email.com?subject=Feedback" onsubmit="return check(contacts) ">
<center>
<script language="JavaScript">
</script>
<table class="name_fields">
<tr>
<td><div align="left">Ваше имя</div></td>
<td><div align="left">
<input type="text" name="name" size="40" onfocus="this.style.background='#e0f7bd'" onblur="this.style.background='#ffffff'">
</div></td>
</tr>
<tr>
<td><div align="left"></div></td>
<td><div align="left">
<input type="hidden" name="browser" value=navigator.useragent >
<input type="hidden" name="date" value=Date() >
</div></td>
</tr>
<tr>
<td><div align="left">Тема</div></td>
<td><div align="left">
<input type="text" name="theme" size="40" onfocus="this.style.background='#e0f7bd'" onblur="this.style.background='#ffffff'">
</div></td>
</tr>
<tr>
<td><div align="left">Сообщение</div></td>
<td><div align="left">
<textarea rows="10" name="message" cols="40" onfocus="this.style.background='#e0f7bd'" onblur="this.style.background='#ffffff'"></textarea>
</div></td>
</tr>
<tr>
<td><div align="left">Ваш E-mail</div></td>
<td><div align="left">
<input type="text" name="e_mail" size="40" onfocus="this.style.background='#e0f7bd'" onblur="this.style.background='#ffffff'">
</div></td>
</tr>
<td valign="top" colspan="2" align="center"><table border="0" width="80%">
<tr>
<td align="center">
<p><font color="#008000"></font></td>
<td align="center">
</td>
<td align="center">
</tr>
</table></td>
<tr>
<td colspan="2">
<p align="center"><input type=submit value="Отправить" onClick="checkEmail(document.contacts.e_mail.value)">
</td>
</tr>
</table>
</center>
</form>
</body>
</html>
В результате открывается почтовый клиент. В поле почтового клиента "Кому" вводится "example@email.com", в поле почтового клиента "Тема" - "Feedback". В теле письма отображается информация из формы, которую заполняет пользователь на сайте. В теле письма почтового клиента также должны отображаться скрытые поля с данными о браузере пользователя и текущей датой и временем. Задача была следующая: Создать форму для отправки обратной связи с проверкой полей и скрытыми полями о браузере и дате, времени(без использования php, jQuery, ajax и т.п.) используя html, javascript, почтовый клиент. Мне осталось добавить скрытые поля с данными о браузере пользователя и текущей датой и временем(данные поля должны оказаться в теле письма в почтовом клиенте). У меня эти скрытые поля никак не получаются в том виде, в котором задумал :) Пример того, что отображается у меня в теле письма почтового клиента: name=TestName&browser=navigator.useragent&date=Dat e%28%29&theme=TestTheme&message=TestMessage&e_mail =example%40email.com У меня navigator.useragent и Date() отображаются как текст. Куда я только не вставлял этот useragent... Пример того, что должно быть в теле письма в почтовом клиенте: name=TestName&date=Fri Nov 03 2017 17:54:57 GMT+0300 (RTZ 2 (зима))&browser=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.75 Safari/537.36&theme=TestTheme&message=TestMessage&e_mail= example%40email.com ИТАК, Подскажите пожалуйста как мне добавить скрытые поля с данными и браузере пользователя, текущей датой и временем , чтобы отображалось корректно, примерно как в примере выше(без php, ajax. jQuery и т.п.) :help: Заранее спасибо! P.S. Если невозможно сделать эти поля скрытыми, то пусть они просто добавятся в тело письма. |
$(function() {
$('#contacts').append('<input type="hidden" name="browser" value="'+navigator.userAgent+'"><input type="hidden" name="date" value="'+new Date()+'">')
});
(RTZ 2 (зима)) - это от браузера зависит. |
1. А можно узнать в какое место кода это вставить?
2. $(function(){}) похоже на jQuery. 3. Если это так,то можно ли как-то без jQuery сделать? |
Цитата:
<script>
var form = document.getElementById('contacts'),
agent = document.createElement('input'),
date = document.createElement('input');
agent.type = date.type = "hidden";
agent.name = "browser";
agent.value = navigator.userAgent;
form.appendChild(agent);
date.name = "date";
date.value = new Date();
form.appendChild(date);
</script>
PS. Имя формы не так и необходимо, пусть это будет id, именно по нему получается форма в коде. |
Спасибо! :dance:
Вставил этот скрипт перед </body> (в строчку №165) и в строке <form name="contacts" method="POST" action="mailto:example@email.com?subject=Feedback" onsubmit="return check(contacts) "> (строка №60) поменял "name" на "id" и все заработало. Большое спасибо :) |
onsubmit="return check(this)"
|
Теперь проверка email слетела.
Цитата:
Как бы починить проверку email? |
this в аргументе, это ссылка на форму, а в функции переменная form примет ее. Так будет правильнее, а не передача по id.
Что касается проверки: это <input type=submit value="Отправить" |
| Часовой пояс GMT +3, время: 03:29. |