Отправить 2 формы с 1 кнопкой, form1 после формы 2 завершена

Question

У меня проблема:

2 формы, которые необходимо отправить одной кнопкой. Я объясню, как это должно работать. И, конечно, мой код до сих пор.

#frmOne содержит поле url, где мне нужно скопировать данные из моего #frmTwo, это работает. (она заставляет посетителя использовать WWW, а не HTTP: //. И т.д.)

При нажатии 1 кнопки отправки

1. Проверка полей #frmOne (только URL работает сейчас, помощь нужна на другие)
2. Вызвать #frmTwo и показать результат в iframe. результат показывает индикатор выполнения (работает) Но Div, modal или любое другое решение, кроме iframe, приветствуются.
3. Закрыть #frmOne (не работает)
4. Наконец процесс (представить) #frmOne если #frmTwo делается (не работает)

Процесс завершен код #frmTwo в IFRAME =

<div style='width' id='information'>Process completed</div> 

<ol class="forms"> 
<iframe width="100%" height="50" name="formprogress" frameborder="0" scrolling="no" allowtransparency="true"></iframe> 
<div id="txtMessage"></div> 
</ol> 

<div id="hide-on-submit"> 
<form id="frmOne" method="post"> 
<input type="text" name="company" id="company" > 
<input type="text" name="url" id="url" > 
<input type="text" name="phone" id="phone" > 
<input type="text" name="occupation" id="occupation" > 
<textarea rows="20" cols="30" name="summary" id="summary" > 
<button type="submit" class="btn btn-danger">Submit</button> 
</form> 
</div> 

<form id="frmTwo" method="post" target="formprogress"></form> 

<script> 
jQuery(document).ready(function(){ 

    //Cache variables 
    var $frmOne    = $('#frmOne'),  
     $frmTwo    = $('#frmTwo'), 
     $txtMessage   = $('#txtMessage'), 
     frmTwoAction  = 'http://www.mydomainname.com/form.php?url='; 

    //Form 1 sumbit event 
    $frmOne.on('submit', function(event){ 
     event.preventDefault(); 

     var strUrl = $frmOne.find('#url').val(); 

     //validation 
     if(strUrl === ''){ 

      $txtMessage.html('<b>Missing Information: </b> Please enter a URL.'); 
     }   
     else if(strUrl.substring(0,7) === 'http://'){ 
      //Clear field 
      $frmOne.find('#url').val('');    
      $txtMessage.html('<b>http://</b> is not supported!');    
     } 
     else if(strUrl.substring(0,4) !== 'www.'){ 
      //Clear field 
      $frmOne.find('#url').val('');    
      $txtMessage.html('<b>Invalid URL</b> Please enter a valid URL!'); 
     } 
     else{ 
      //set form action and submit form 
      $frmTwo.attr('action', frmTwoAction + strUrl).submit(); 

    $('#hide-on-submit').hide(0).fadeIn(1000); 
    $('form#frmOne').submit(function(e) { 

     $(this).hide(1000); 

      return true; // let form one submit now! 
     } 

     return false; 

    }); 

}); 
</script> 

Answer 1

читать здесь https://api.jquery.com/jQuery.ajax/. в основном вам нужно отправить первый с $ .ajax, а затем, когда вы получите ответ сервера (в функции success()) вам нужно отправить вторую форму, снова ширину ajax().

Что-то вроде:

$form1.on('submit', function(e) { 
    e.preventDefault(); //don't send the form yet 
    $.ajax(
     url: $(this).attr('action'), 
     type: $(this).attr('method'), 
     data: $(this).serialize() 
    ).success(function(data) { 
     alert('form one sent'); 
     $.ajax(
      url: $('#form2').attr('action'), 
      type: $('#form2').attr('method'), 
      data: $('#form2').serialize() 
     ).success(function(data) { 
      alert('form two sent'); 
     }) 
    }); 
}); 

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