Форум

codehard · #1 (**permalink**) 21.11.2016, 13:17

Добрый день, уважаемые друзья! Нужна ваша помощь, так как только знакомлюсь с js и пока не могу справится самостоятельно. Задача следующая:
есть форма
<form action="/mailform.php" method="post">
Выберите город:
<input type="checkbox" name="city[]" value="Moscow">Москва
<input type="checkbox" name="city[]" value="Piter">Питер
</form>

также на этой странице расположена вторая форма
<form action="/mailform.php" method="post">
<input type="text" name="uname" placeholder="Ваше ФИО">
<input type="submit" name="request_btn">
</form>

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

нагуглил и осилил только следующее:
<script>
var selectedElements = $("form[action='mailform.php'] input:checkbox:checked"); // получаем все поля отмеченные чекбоксами

далее их надо как-то обработать(собрать в массив видимо ассоциативный) и вот тут проблема, ведь еще надо учесть поля во второй форме. И собрав все вместе отправить на мыло админа.

</script>

Прошу помощь разобраться

, заранее спасибо.

ksa · #2 (**permalink**) 21.11.2016, 13:28

Сообщение от codehard

есть форма

<form action="/mailform.php" method="post">
Выберите город:
<input type="checkbox" name="city[]" value="Moscow">Москва
<input type="checkbox" name="city[]" value="Piter">Питер
</form>

также на этой странице расположена вторая форма

<form action="/mailform.php" method="post">
<input type="text" name="uname" placeholder="Ваше ФИО">
<input type="submit" name="request_btn">
</form>

В чем смысл разделения форм?
Если отправляться они должны одной кнопкой...

ksa · #3 (**permalink**) 21.11.2016, 13:35

Сообщение от codehard

далее их надо как-то обработать(собрать в массив видимо ассоциативный) и вот тут проблема, ведь еще надо учесть поля во второй форме. И собрав все вместе отправить на мыло админа

Как вариант, сформировать строку параметров для дальнейшего формирования УРЛ запроса...

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function (){
	var obj=$('form');
	obj.eq(1).submit(function (){
		var prm=obj.eq(0).serialize();
		prm+='&'+obj.eq(1).serialize();
		alert(prm);
		return false;
	});
});
</script>
</head>
<body>
<form action="/mailform.php" method="post">
	<p>Выберите город:</p>
	<label><input type="checkbox" name="city[]" value="Moscow" />Москва</label>
	<label><input type="checkbox" name="city[]" value="Piter" />Питер</label>
</form> 
<form action="/mailform.php" method="post">
	<input type="text" name="uname" placeholder="Ваше ФИО" />
	<input type="submit" name="request_btn" />
</form>
</body>
</html>

codehard · #4 (**permalink**) 21.11.2016, 14:14

Сообщение от ksa

В чем смысл разделения форм?
Если отправляться они должны одной кнопкой...

https://gyazo.com/d365d9541dcb50a3dd462601f46fe06a вот как это выглядит, думаю теперь понятно, зачем форма разделена на две

ksa · #5 (**permalink**) 21.11.2016, 14:18

Сообщение от codehard

вот как это выглядит

Я не могу ходить на всякие ресурсы...

Т.к. за мной следит руководство.

Но если на странице форм всего две - однозначно можно обойтись одной.

laimas · #6 (**permalink**) 21.11.2016, 14:28

Сообщение от codehard

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

А вы как программист в курсе, что поля формы могут вообще быть расположены вне тега form? А обрамить тегом формы ее поля (как бы двух форм), это раз плюнуть. Чего огород городить?

codehard · #7 (**permalink**) 21.11.2016, 14:38

Сообщение от laimas

А вы как программист в курсе, что поля формы могут вообще быть расположены вне тега form? А обрамить тегом формы ее поля (как бы двух форм), это раз плюнуть. Чего огород городить?

вопрос снят, обойдусь без js. спасибо.

Форум

Справочник

Discord чат

Курсы javascript