This code will allow you to make a text box on your form that automatically duplicates it's input into a second field. For this example, UMstreet is being copied into UMbillstreet. This allows you to use the billing street address to check the AVS result without having to request the billing address twice.
This method can be used for any textbox you would like to use for more than one field. Use the examples below as a template, and simply replace UMstreet with the field you would like to duplicate and UMbillstreet with the field receiving the duplicate.
HTML
Insert the following between <nowiki><head> and </head></nowiki> tags:
<script>
function copyField()
{
var form = document.epayform;
form.UMbillstreet.value=form.UMstreet.value;
form.UMbillzip.value=form.UMzip.value;
}
</script>
Next find the hidden input fields. It should looks like this:
<input type="hidden" name="UMcommand" value="[UMcommand]">
<input type="hidden" name="UMamount" value="[UMamount]">
<input type="hidden" name="UMtax" value="[UMtax]">
<input type="hidden" name="UMinvoice" value="[UMinvoice]">
<input type="hidden" name="UMcustid" value="[UMcustid]">
<input type="hidden" name="UMrecurring" value=“[UMrecurring]">
Add a line for the field you are copying into. it should look like this:
<input type="hidden" name="UMbillstreet" value=“">
If the field you are copying into already has a textbox remove it by deleting the section that looks like this:
<tr>
<td bgcolor="#F0F0F0" width="234" align="right"><font face="Verdana" size="2">Address:</font></td>
<td bgcolor="#F0F0F0" width="450">
<input type="text" name="UMbillstreet" size="25" value="[UMbillstreet]"></td>
</tr>Lastly find the text input box for the field you are copying from:
<tr>
<td bgcolor="#F0F0F0" width="234" align="right"><font face="Verdana" size="2">Card Billing Address:
</font></td>
<td bgcolor="#F0F0F0" width="450">
<input type="text" name="UMstreet" size="25" value="[UMstreet]"></td>
</tr>
Add onChange="copyAVS()" to the input tag so it looks like this:
<tr>
<td bgcolor="#F0F0F0" width="234" align="right"><font face="Verdana" size="2">Address:
</font></td>
<td bgcolor="#F0F0F0" width="450">
<input type="text" name="UMstreet" size="25" value="" onChange="copyField()"></td>
</tr>
Once you have saved changes to your payment form, one text box will populate into two fields.
Additional Resources
For comprehensive documentation, sample code, and detailed guides, please visit the USAePay Help Page for Payment Forms. This resource provides in-depth information to help understand the functionality of the payment forms and more advanced adjustments using javascript.
Need Help?
If you encounter any issues or have questions while adjusting the payment form, our friendly support team is here to help. Contact us through your Merchant Console or visit our support page for assistance.