Как 2 формы "повешать" на один submit?

@Kastaneda · Регистрация: 12.12.2009

Студворк — интернет-сервис помощи студентам

Привет!
Суть проблемы: на странице имеются 2 формы. Нужно сделать одну кнопку submit, которая бы отправляла данные из этих 2х форм. Архитектура страницы устроена так, что сделать из этих 2х форм одну просто не получается. Гуглил в эту сторону, что-то не помогло.
Может кто-то знает, как это реализовать?

Не по теме:

Подразумеваю, что вопрос нубский, но я html вообще не знаю, а писать приходиться)

Vovan-VE · 19.11.2011, 10:16

Kastaneda, Формы постятся на один урл или на разные?

@Vicont · 19.11.2011, 10:45

Я бы сделал через Ajax. Пример функций:
Функция по сбору данных из форм:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/* Формирование запроса */
            /*
                mas- массив идентификаторов полей форм
            */
            function validate(mas,url){
                var data = '', separate = '';
                //Формирование строки запроса
                for(i=0; i<mas.length; i++){
                   separate = data.length == 0 ? '' : '&'
                   data +=  separate + mas[i]+ '=' + document.getElementById(mas[i]).value
                }
                    alert(data);
                //Отправка данных на сервер
                sendToServer(url,data);
                    
                return false;
            }

Отправка данных форм:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
/* Функция "Отправка данных на сервер" */
            function sendToServer(url,data){
                /* Создание кроссбраузерного объекта XMLHttpRequest */
                if (window.XMLHttpRequest)
                {
                    XMLHttpRequestObject = new XMLHttpRequest();
                }
                else if (window.ActiveXObject)
                {
                    XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP")
                }
                    
                if (XMLHttpRequestObject)
                {
                    XMLHttpRequestObject.open("POST",url);      
                    XMLHttpRequestObject.setRequestHeader('Content-type','application/x-www-form-urlencoded');
                    XMLHttpRequestObject.onreadystatechange = function()
                    {
                        if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200)
                        {
                            /* Мы получили ответ от сервера */
                                             alert(XMLHttpRequestObject.responseText) //Просто вывод ответа
                        }
                    }
                    XMLHttpRequestObject.send(data);
                }
            }

Формы:

HTML5
1
2
3
4
5
6
7
<form name="form1" action="#">
  Ваше имя: <input type='text' id="name"/>
</form>
<form name="form2" action="#">
   Ваша фамилия: <input type="text" id="surname"/>
   <button onclick="validate(['name','surname'],'');">Отправить</button>
</form>

P.S.
Если можно сделать средствами HTML или другим способом,буду признателен за получение информации.

@Kastaneda · 19.11.2011, 11:27 **[ТС]**

Сообщение от Vovan-VE

Kastaneda, Формы постятся на один урл или на разные?

Постоянно на один. Просто раньше было 2 страницы (сбор информации от пользователя), потом решили их объеденить в одну, вот так и появилась эта проблема.

Vicont, спасибо, но было бы предпочтительней как-нибудь сделать это средствами html. Но если ни чего не решиться, то воспользуюсь твоим вариантом.

Vovan-VE · 19.11.2011, 11:30

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

Постоянно на один

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

@Kastaneda · 19.11.2011, 11:53 **[ТС]**

Сообщение от Vovan-VE

А какой тогда смысл дробить на две формы?

Формы располагаются в разных дивах, может я чего-то в html и не понимаю, но я не смог объеденить эти формы. Если сделать одну, которая включает эти дивы с этими 2 формами, то там тогда еще 3тья форма захватывается, которая не должна.

Vovan-VE · 19.11.2011, 11:54

Kastaneda, Формы нельзя влаживать друг в друга. Вместо тех двух-трех сделайте одну, которая включает в себя оба div'а.

@Vicont · 19.11.2011, 11:57

Покажите разметку, там будет виднее.

@Kastaneda · 19.11.2011, 13:31 **[ТС]**

Вот, выкинул из кода все лишнее:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<div>
    <div>
        <form action="some.php" method="POST"> 
            <input  type="file">
        </form>
    </div>
    <div>
        <!--нужны данные из этой формы -->
                <form action="some.php" method="POST">
                    <textarea type="text"></textarea>
                </form>
    </div>
</div>
 
<div>
    <!-- и из этой -->
    <form action="some.php" METHOD="POST">
        <div>
            <table>
            <!-- таблица с полями типа type="text" для ввода данных -->
            </table>
            
            <div>
                <input type="radio"> <!-- несколько радио батонов -->
            </div>
        </div>
    </form>
</div>
 
<!-- вот на этот submit нужно прицепить 2 формы, показанные выше -->
<input type="submit"/>

Как видите, объединить 2 формы в одну не получиться в силу разметки.

Vovan-VE · 19.11.2011, 13:33

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

Как видите, объединить 2 формы в одну не получиться в силу разметки.

Так разметьте по-другому, чтобы оба div'а были внутри одной формы.

@Vicont · 19.11.2011, 13:41

Так нельзя сделать?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<div>
            <div>
                <form action="some.php" method="post"> 
                        <input  type="file"/>
                </form>
            </div>
        </div>
        <div>
            <!-- Общая форма -->
            <form action="some.php" method="post">
                <div>
                    <table>
                        <!-- таблица с полями типа type="text" для ввода данных -->
                    </table>
                    <div>
                        <!-- Данные из верхней формы -->                    
                        <textarea></textarea>
                        <input type="radio" name="some_name" value="some_value"> <!-- несколько радио батонов -->
                    </div>
                </div>
            </form>
        </div>
         
        <!-- вот на этот submit нужно прицепить 2 формы, показанные выше -->
        <input type="submit"/>

@Kastaneda · 19.11.2011, 13:42 **[ТС]**

Мне кажется, что не получиться, там дизайн страницы такой. Вот, сайт пока вообще не работает, выложили для теста. Там поле description и Ihre Kontankdaten нужно повешать на кнопку "Отправить запрос" (хз с чего она по русски написана, вчер не было

)

@Vicont · 19.11.2011, 13:45

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

@Kastaneda · 19.11.2011, 13:47 **[ТС]**

Vicont, наверное вариант! Нужно попробовать)

Не по теме:

Сам бы не додумался, что-то тяжело мне html дается. По -моему проще дизасемблировать экзешник и восстановить сишный код, чем разместить "вот эту картинку рядом с этой вот кнопочкой":D

@Vicont · 19.11.2011, 13:50

Это скорее CSS, чем HTML. Поиграйтесь со свойством position,а также можно и с margin-top

@Kastaneda · 19.11.2011, 13:56 **[ТС]**

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

Это скорее CSS, чем HTML

Ну да, но в моем случаю и то и другое тяжело идет. Меня эта верстка прям из себя выводит

Новые блоги и статьи Все статьи Все блоги /
http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .	Расчёт переходных процессов в цепи постоянного тока igorrr37 16.01.2026 / * Дана цепь постоянного тока с R, L, C, k(ключ), U, E, J. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа, решает её и находит переходные токи и напряжения на элементах схемы. . . .	Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .
Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/	WordPad для Windows 11 Jel 10.01.2026 WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .	Classic Notepad for Windows 11 Jel 10.01.2026 Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .	Почему дизайн решает? Neotwalker 09.01.2026 В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .

@Kastaneda 5232 / 3205 / 362 Регистрация: 12.12.2009 Сообщений: 8,143 Записей в блоге: 2

	Как 2 формы "повешать" на один submit? 19.11.2011, 09:45. Показов 3128. Ответов 15 Метки нет (Все метки) Привет! Суть проблемы: на странице имеются 2 формы. Нужно сделать одну кнопку submit, которая бы отправляла данные из этих 2х форм. Архитектура страницы устроена так, что сделать из этих 2х форм одну просто не получается. Гуглил в эту сторону, что-то не помогло. Может кто-то знает, как это реализовать? Не по теме: Подразумеваю, что вопрос нубский, но я html вообще не знаю, а писать приходиться) 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	19.11.2011, 10:16
	Kastaneda, Формы постятся на один урл или на разные? 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	19.11.2011, 11:54
	Kastaneda, Формы нельзя влаживать друг в друга. Вместо тех двух-трех сделайте одну, которая включает в себя оба div'а. 0

@Vicont front-end developer 284 / 275 / 39 Регистрация: 31.08.2010 Сообщений: 577 Записей в блоге: 1
	19.11.2011, 11:57
	Покажите разметку, там будет виднее. 0

@Kastaneda 5232 / 3205 / 362 Регистрация: 12.12.2009 Сообщений: 8,143 Записей в блоге: 2
	19.11.2011, 13:42 [ТС]
	Мне кажется, что не получиться, там дизайн страницы такой. Вот, сайт пока вообще не работает, выложили для теста. Там поле description и Ihre Kontankdaten нужно повешать на кнопку "Отправить запрос" (хз с чего она по русски написана, вчер не было) 0

@Vicont front-end developer 284 / 275 / 39 Регистрация: 31.08.2010 Сообщений: 577 Записей в блоге: 1
	19.11.2011, 13:45
	А не вариант, поле description поместить в нижнюю форму, но прописать ему позиционирование, которое сдвинет его в верхнюю форму? Визуально все будет также, только логически все будет в одной форме. 1

@Kastaneda 5232 / 3205 / 362 Регистрация: 12.12.2009 Сообщений: 8,143 Записей в блоге: 2
	19.11.2011, 13:47 [ТС]
	Vicont, наверное вариант! Нужно попробовать) Не по теме: Сам бы не додумался, что-то тяжело мне html дается. По -моему проще дизасемблировать экзешник и восстановить сишный код, чем разместить "вот эту картинку рядом с этой вот кнопочкой":D 0

@Vicont front-end developer 284 / 275 / 39 Регистрация: 31.08.2010 Сообщений: 577 Записей в блоге: 1
	19.11.2011, 13:50
	Это скорее CSS, чем HTML. Поиграйтесь со свойством position,а также можно и с margin-top 0