Create Background Submit Form

Create Background Submit Form

I have two form code (getresponse webform code and a normal formcode ). I
want to have a single visible OPTIN FORM for only purposed to input user
email address and when the user submit the FORM it will submit the
getresponse webform code to the background. I know it will do some jquery
and ajax can you show me example codes how to do it?
NORMAL FORM:
<!--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 -->
I want to get the email address on the visible form to put on getresponse
webform email fields on the background and submit it on the background. I
really want your help guys. thanks on advance. sorry for bad English :)
GET RESPONSE WEB FORM CODE MUST BE INVISIBLE TO THE USER and run to the
background:
<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>