две формы input как одна

296

26 ноября 2016, 19:47

<table border="5"><tr><td><center>
 /Форма первая/<br> 
<form action="q">
<span class="red">ник</span><br>
<input class="blue center br10" name="name"><br>
<span class="red">код</span><br> 
<input class="blue center br10" name="cods"><br>
<input class="green br10" type="submit" value="отправить"><br>
</form></center></td></tr></border>
<br>
<table border="5"><tr><td><center>
 /Форма  вторая/<br> 
<form action="q2">
<span class="red">ник2</span><br>
<input class="blue center br10" name="name2"><br>
<span class="red">код2</span><br> 
<input class="blue center br10" name="cods2"><br>
<input class="green br10" type="submit" value="отправить"><br>
</form></center></td></tr></border>

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

а. первая кнопка отправив данные ждет ответа.
б. вторяа кнопка отправив данные не реагирует на ответ.

Answer 1

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

form1.addAventListener('blur', function(event) {
      if(event.target.nodeName.toLowerCase() == 'input'{
        swith(event.target.name) {
           case 'nic' :
             form2.elements[0].value = form1.elements[0].value;
             break;
           case 'pass' :
             form2.elements[1].value = form1.elements[1].value;
             break;
        }
      } 
});

Так при потере фокуса на инпутах первой формы их значения будут записываться в значения инпутов второй формы. Далее пишешь обработчик на submit, в котором отправляешь обе формы, не зависимо от того в какой из них была нажата кнопка.
Если уточнишь про кнопки которые ждут ответ и не реагируют на него может чего с рабочими примерами и предложу (так, для справки, кнопки после нажатия ни каких ответов не ждут. Данные из формы пересылаются указанным методом в атибуте формы method в обработчик указанный в атрибуте action, либо при его отсутствии на саму страницу.)