Создать фон Отправить форму

Question

У меня есть код из двух форм (код веб-формы getresponse и обычный форм-код). Я хочу иметь одну видимую OPTIN FORM, предназначенную только для ввода адреса электронной почты пользователя, и когда пользователь отправит FORM, он отправит код веб-формы getresponse на задний план. Я знаю, что это сделает некоторые jquery и ajax, вы можете показать мне примерные коды, как это сделать?

НОРМАЛЬНАЯ ФОРМА:

<!--VISIBLE FORM --> 
<form method="post" action="#" target="frame_result"> 
    <input id="email" type="text" name="email" placeholder="email" /> 
    <br /> 
    <input id="blast" type="button" value="GET FREE QOUTE" name="submit" /> 
</form> 
<!--VISIBLE FORM --> 

Я хочу, чтобы получить адрес электронной почты в видимой форме, чтобы положить на GetResponse WebForm электронной почты полей на фоне и представить его на задний план. Мне очень нужна твоя помощь. спасибо заранее. извините за плохой английский :)

GET РЕАКЦИЯ WEB FORM код должен быть незаметным для пользователя и работать в фоновом режиме:

<div id="WFItem505952" class="wf-formTpl"> 
<form accept-charset="utf-8" action="https://app.getresponse.com/add_contact_webform.html" 
method="post"> 
     <div id="WFIcenter" class="wf-body"> 
      <ul class="wf-sortable" id="wf-sort-id"> 
       <li class="wf-email" rel="undefined" style="display: block !important;"> 
        <div class="wf-contbox"> 
         <div class="wf-labelpos"> 
          <label class="wf-label">Email:</label> 
         </div> 
         <div class="wf-inputpos"> 
          <input class="wf-input wf-req wf-valid__email" type="text" name="email"></input> 
         </div> 
         <em class="clearfix clearer"></em> 
        </div> 
       </li> 
       <li class="wf-submit" rel="undefined" style="display: block !important;"> 
        <div class="wf-contbox"> 
         <div class="wf-inputpos"> 
          <input type="submit" class="wf-button" name="submit" value="Sign Up!" 
          style="display: inline !important; width: 120px !important;"></input> 
         </div> 
         <em class="clearfix clearer"></em> 
        </div> 
       </li> 
      </ul> 
     </div> 
    </div> 
    <input type="hidden" name="webform_id" value="505952" /> 
</form> 

Answer 1

DEMO

Ошибка только потому, что моя форма не имеет действительного действия & метод еще :-) Замените это своим, и все будет в порядке. Я просто показываю, как сделать вашу вторую форму скрытой и отправить ее через вашу первую форму. Вы можете передать переменные во вторую форму, если вам нужно.

HTML:

<form id="form1"> 
    <h5>Form 1</h5> 
    <label for="username"><span>Username</span><input name="username" id="username" type="text" /></label><br/> 
    <label for="email"><span>Email</span><input name="email" id="email" type="text" /></label><br/> 
    <input type="submit" value="Submit Form 1" /> 
    </form> 
    <form id="form2"> 
    <h5>Form 2</h5> 
     <input type="text" name="username1" id="username1" /> 
     <input type="text" name="email1" id="email1" /> 
    <input type="submit" value="Submit Form 2"/> 
    </form> 

CSS:

/* Hiding Form 2 */ 
#form2{ 
    visibility:hidden; 
} 

JS:

$(function(){ 
    $('#form1').on('submit', function(){ 
     $('#username1').val($('#username').val()); 
     $('#email1').val($('#email').val()); 
     $('#form2').submit(); 
     return false; 
    }); 
});