I am trying to copy one input field to another in a different page. The scenario is when the the user press the button to submit the input field from one form goes to another form.
I would like to accomplish something like this: http://jsfiddle.net/bxHQ5/
This what I have done. It copies the input field to another.
<input type="text"id="EmailAddress" name="EmailAddress" value="" >
<input type="text" id="Username" name="Username" value="">
$("#EmailAddress").keyup(function(){
$("#Username").val(this.value);
});
Here is another solution that I have found, but this one clones the input and adds a new one.
<input type="text" onchange="document.body.appendChild(this.cloneNode(true))" />
UPDATE – I got it working – I am posting the solution for anyone who needs it
1st Form :
<form action="/register-form/" method="get"><input style="float: right;" name="search" type="submit" value="FREE TRIAL" />
2nd form :
<form id="registration_form" class="form-horizontal"
action="PHP_CRM_URL_HERE" method="get" name="registration_form">
<div class="form-group">
<div class="col-sm-6">
<input id="yourEmail" class="form-control input-group-lg reg_name"
style="height: 50px;" title="yourEmail" name="yourEmail" type="yourEmail"
value="[insert_php] echo $emailValue; [/insert_php]" placeholder="Email
Address" />
</div>
<div class="col-sm-6">
<input id="yourPhone" class="form-control input-group-lg reg_name"
style="height: 50px;" title="yourPhone" name="yourPhone" type="yourPhone"
placeholder="Mobile Number" />
</div>
</div>
<!--/form-group-->
<div class="form-group">
<div class="col-sm-12">
<input id="yourPassword" class="form-control input-group-lg reg_name"
style="height: 50px;" title="yourPassword" name="yourPassword"
type="yourPassword" placeholder="Password" />
</div>
</div>
<!--/form-group-->
<p style="text-align: center;"><button class="contact-submit"
style="background: #ca0002 none repeat scroll 0px 0px; border-radius: 2px;
color: #ffffff; width: 12%; height: 45px;"
type="submitContactForm">Register</button></p>
</form>
PHP Code to parse the input field from the 1st form
<?php
$emailValue = $_REQUEST['term'] ? $_REQUEST['term'] : null;
?>
I hope this will get you started in the direction you want to go.
This fiddle just shows the basic mechanics of hiding the first form while saving its form data, then displaying a second form with that data. If you want to hand that data to a server you will want to do an ajax request as well on submit of the first form.
If you want to do a full POST request to the server and then redirect to a new form, that would be a case for session storage. So in your submit function, you can do something like:
then when you load the form on your next page you can pull the data back out to prepopulate it: