Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Логика формы отправки и чекбоксы (https://javascript.ru/forum/css-html/66612-logika-formy-otpravki-i-chekboksy.html)

Dean 27.12.2016 17:25

Логика формы отправки и чекбоксы
 
Доброго времени суток!
Нужна помощь в описании логики работы скрипта.:help:

Есть форма в HTML. В форме есть типичные поля (Имя,E-mail,Пароль), также есть 2 чекбокса (условно у них есть переход на : index1.html и index2.html).

:help: Помогите :help: написать скрипт со следующей логикой :
Форма заполнена информацией (проверку полей смогу написать сам) -> Выбран один из чекбоксов -> Отправка данных в БД (либо изначально в виде текстового док-а) -> Страница выдается основываясь на выборе чекбокса (index1.html или index2.html).

Dilettante_Pro 27.12.2016 18:07

Dean,
Цитата:

Сообщение от Dean
Выбран один из чекбоксов ->

Вместо чекбоксов здесь, наверное, лучше радио, чтобы наверняка один был выбран.
Отправка - стандартная, по submit (можно с перехватом для проверки полей.)
<!DOCTYPE html>
<html>
<head>
<title>Form</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
    function getForm() {
        var request = $.param($('#req').serializeArray());
        alert(request);
    }
</script>
</head>
<body>
<form id="req" name="req" onsubmit="getForm()">
   <label>Имя</label><input type="text"  name="name" required /> <br />
   <label>Email</label><input type="text"  name="email" required /><br />
   <label>Страница 1</label><input type="radio" name="page" value="index1.html" checked/><br />
   <label>Страница 2</label><input type="radio" name="page" value="index2.html" /><br />
   <input type="submit" value="Отправить" />
</form>
</body>
</html>

ksa 28.12.2016 08:26

Цитата:

Сообщение от Dean
Страница выдается основываясь на выборе чекбокса (index1.html или index2.html)

Предложу такой вариант...

<!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(){
	$('#req').submit(function(){
		this.action=$(this).find('[name="page"]:checked').val();
	});
});
</script>
</head>
<body>
<form id="req" name="req">
   <label>Имя</label><input type="text"  name="name" required /> <br />
   <label>Email</label><input type="text"  name="email" required /><br />
   <label>Страница 1</label><input type="radio" name="page" value="index1.html" checked/><br />
   <label>Страница 2</label><input type="radio" name="page" value="index2.html" /><br />
   <input type="submit" value="Отправить" />
</form>
</body>
</html>

Dilettante_Pro 28.12.2016 10:14

ksa,
Проблема в том, что ТС молчит. Возможно, index1.html - это вовсе не action, а параметр для action
Обработку я и не старался расписывать - это так, просто иллюстрация принципа.
PS: убрали бы getForm() из своего примера...:)

ksa 28.12.2016 10:22

Цитата:

Сообщение от Dilettante_Pro
убрали бы getForm() из своего примера

Убрал... :yes:


Часовой пояс GMT +3, время: 21:47.