Rendering the Hosted Payment Form

Below is a “typical” Hosted Payment Form (HPF) using the default color/font palette, a custom logo, and a required Amount field. Each standard input field makes use of HTML5 placeholders to assist users in completing the form. Required fields are marked with an asterisk in the label. Real-time field level form validation is performed on each relevant form field, and the form itself will not submit until it is validated, ensuring that the data sent through to the PayConex API is as complete and accurate as possible.

Rendering Hosted Payment Forms

The Hosted Payment Forms can be accessed via a direct HTTP request using either GET or POST methods.

The base URL to the Hosted Payment Pages:

Certification https://cert.payconex.net/paymentpage/enhanced/
Production https://secure.payconex.net/paymentpage/enhanced/

These parameters must be sent with your request:

PARAMETER	TYPE	CONTEXT	DESCRIPTION
action	string	Required	The API method name for rendering HPFs.
aid	integer	Required	Your PayConex Account ID (Zero-padded 12-digit).
id	integer	Required	The Hosted Payment Form numerical ID.

These parameters are optional, depending upon the settings of your payment page:

PARAMETER	TYPE	CONTEXT	DESCRIPTION
amount	string	conditional	Required for display_only & hidden fields. Default amount can be sent for required & optional. If form uses multiple amounts both must be sent, delimited by a colon, e.g., 123.45:1.57)
first_name	string	conditional	Payer/customer First Name. Required if display_only or hidden.
last_name	string	conditional	Payer/customer Last Name. Required if display_only or hidden.
street_address1	string	conditional	Payer/customer street address. Required if display_only or hidden.
city	string	conditional	Payer/customer city. Required if display_only or hidden.
state	string	conditional	Payer/customer state (2-character). Required if display_only or hidden.
zip	string	conditional	Payer/customer postal (zip) code. Required if display_only or hidden.
country	string	conditional	Payer/customer Country. Required if display_only or hidden.
phone	string	conditional	Payer/customer phone number. Required if display_only or hidden.
email	string	conditional	Payer/customer e-mail address. Required if display_only or hidden.
token_id	integer	optional	A valid payment token ID (transaction ID from previous successful AUTH, SALE, or STORE). Setting this disables the Payment Inputs for Card & ACH data.

Custom Form Fields

In addition to the pre-defined fields listed above, merchants can pass their own user-defined custom parameters. These parameters are defined when creating the hosted form. To submit data to be passed through the system via custom form fields simply send key/value pairs representing each custom field’s name, and its value. For example, if one of your custom fields is capturing customer account numbers you might define that as customer\_number and in the API request transmit it as &customer\_number=1035468857.

If a custom field is defined as either display_only or hidden, it must be passed with the request, even if its value is blank/null.

Sample Code

<a href="https://cert.payconex.net/paymentpage/enhanced/index.php?action=view&aid=123456789012&id=21&amount=123.45:3.95">
  Make a Payment</a>

<iframe src="https://cert.payconex.net/paymentpage/enhanced/?action=view&aid=000000000001&id=1&amount=10.10:1.50"
frameborder="0"
height="850"
width="660"
scrolling="no"
seamless="seamless"
></iframe>

The same form request via HTTP POST could be done with this HTML snippet:

<html>
<head></head>
<body onload="submitForm()">
<form action="https://cert.payconex.net/paymentpage/enhanced" method="post" id="autoPostForm" hidden="hidden" style="visibility:hidden;">
<input type="hidden" name="action" value="view"/>
<input type="hidden" name="aid" value="123456789012"/>
<input type="hidden" name="id" value="21"/>
<input type="hidden" name="amount" value="123.45:3.95"/>
<input type="hidden" name="customer_number" value="1234-ABCD-001-B"/> <!-- Custom Field -->
</form>
<script type="text/javascript">
function submitForm() {
var myform = document.getElementById('autoPostForm');
myform.submit();
}
</script>
</body>
</html>