Quick and dirty Authorize.net donations

I had to add an online donation page to our website recently, and didn't have a lot of time to do it. Instead of trying to learn Ubercart, I thought I would just write the bare minimum that we needed to get going. I had some experience with authorize.net from a project a I did about 6 years ago, and thought what we wanted would be very simple. Alas, Authorize.net had changed things around a bit and my solution didn't turn out quite as nice as I had hoped (It takes 2 pages before you get to Authorize.net).

You can check it out at http://lincolnlutheran.org/donate/online --feel free to make a donation ;^)

The first page asks for the donation amount, the second page takes the donation amount and computes Authorize.net's fingerprint for the transaction, asks for a little more info that our development people wanted and submits it to Authorize.net for payment processing.

Here's the first page, nothing special here. Ignore the ugly javascript. (It might be a good idea to look at the actual page before looking at the html below)

<script type="text/javascript">
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value==""||value<0.01)
  {alert(alerttxt);return false;}
else {return true}
}
}

function validate_form(thisform)
{
with (thisform)
{
if (validate_required(x_amount,"Please enter a donation amount.")==false)
  {document.donateForm.x_amount.focus();document.donateForm.x_amount.value="";document.donateForm.x_amount.style.backgroundColor="#ffcccc";return false;}
}
}
</script>

<form name='donateForm' method='post' action='http://lincolnlutheran.org/friends/donate/online2' onsubmit="return validate_form(this)">

<p>
<fieldset>
<legend>
Please choose the amount of your gift:
</legend>
<input type="radio" name="gift" value="50.00" onclick="document.donateForm.x_amount.value='50.00';document.donateForm.x_amount.disabled=true;document.donateForm.step1.style.color='#ff0000';document.donateForm.x_amount.style.backgroundColor='#ffffff';" /> $50.00<br />
<input checked type="radio" name="gift" value="100.00" onclick="document.donateForm.x_amount.value='100.00';document.donateForm.x_amount.disabled=true;document.donateForm.step1.style.color='#ff0000';document.donateForm.x_amount.style.backgroundColor='#ffffff';"/> $100.00<br />
<input type="radio" name="gift" value="200.00" onclick="document.donateForm.x_amount.value='200.00';document.donateForm.x_amount.disabled=true;document.donateForm.step1.style.color='#ff0000';document.donateForm.x_amount.style.backgroundColor='#ffffff';"/> $200.00<br />

<input type="radio" name="gift" value="other" onclick="document.donateForm.x_amount.disabled=false;document.donateForm.x_amount.focus();"/>
Other: $ <input type='text' disabled size='10' name='x_amount' value='100.00' onFocus="if (this.value=='50.00'||this.value=='100.00'||this.value=='200.00') {this.value='';document.donateForm.step1.style.color='#000000';}" onBlur="if (this.value=='') {document.donateForm.gift[3].checked=false;} else {document.donateForm.step1.style.color='#ff0000';}"/>

</fieldset>
</p>
<input type="submit" name="step1" value="Step 1: Confirm Donation Amount" onclick="document.donateForm.x_amount.disabled=false"/>

</form>

The second page has a little PHP to calculate the fingerprint, and insert values from authorize.net:

<?php
// load vars.php where the login and transaciton key are specified
include ("vars.php");

// Receive the posted amount and format it as a dollar amount without the currency symbol
$amount        = number_format(trim($_POST["x_amount"],"$"),2);

// Generate a random sequence number (required by SIM API)
$sequence  = rand(1, 1000);

// Generate a timestamp
$timestamp    = time ();

// The following lines generate the SIM fingerprint.  PHP versions 5.1.2 and
// newer have the necessary hmac function built in.  For older versions, it
// will try to use the mhash library.
if( phpversion() >= '5.1.2' )
{
$fingerprint = hash_hmac("md5", $login . "^" . $sequence . "^" . $timestamp . "^" . $amount . "^", $key); }
else
{
$fingerprint = bin2hex(mhash(MHASH_MD5, $login . "^" . $sequence . "^" . $timestamp . "^" . $amount . "^", $key)); }
?>


<script type="text/javascript">
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value==""||value=="(required)")
  {alert(alerttxt);document.donateForm.list_me_as.style.backgroundColor ="#ffcccc";return false;}
else {return true}
}
}

function validate_form(thisform)
{
with (thisform)
{
if (validate_required(list_me_as,"Please tell us how to list your name.")==false)
  {list_me_as.focus();return false;}
}
}
</script>

<p>
[img_assist|nid=5006|title=|desc=|link=node|align=right|width=150|height=undefined]
Our Annual Fund Drive turns individual gifts of all sizes into
a collective pool of support for Lincoln Lutheran. It is alumni,
parents, grandparents, and friends of the school, all working
together to make a difference.
<br clear="all" />
</p>

<!-- This form will post to itself to begin with -->
<form name='donateForm' method='post' action='<?php echo $URL; ?>' onsubmit="return validate_form(this)">

<!-- Invoice and description are specified in the vars.php file -->
<input type='hidden' name='x_invoice_num' value='<?php echo $invoice; ?>' />
<input type='hidden' name='x_description' value='<?php echo $description; ?>' />

<!-- Amount is hidden here, but there is also a field for display only below -->
<input type='hidden' name='x_amount' value='<?php echo $amount; ?>' />
<p>
<fieldset>
<legend>
Thank you for choosing the amount of your gift:
</legend>
Donation Amount: $
<input disabled type='text' size='10' name='display_amount' value='<?php echo $amount; ?>' />
<input disabled type="button" value="Step 1: COMPLETED">
<a href="http://lincolnlutheran.org/friends/donate/online">change donation amount</a>
</fieldset>
</p>

<p>
<fieldset>
<legend>
Please tell us a little bit about yourself (check all that apply):<br />
</legend>
<input type="checkbox" name="i_am_an" value="Alumni"> I am an alumni of Lincoln Lutheran.<br />
<input type="checkbox" name="i_am_a" value="Relative of a current LL student"> I am a relative of a current Lincoln Lutheran student.<br />
<input type="checkbox" name="i_am_a" value="Relative of a former LL student"> I am a relative of a former Lincoln Lutheran student.<br />
<input type="checkbox" name="i_am_a" value="Member of a LL association church"> I am a member of an association church.<br />
<input type="checkbox" name="i_am_a" value="Current or former LL employee"> I am a current or former Lincoln Lutheran staff member.<br />
<input type="checkbox" disabled name="other" value="">
<input type='text' name='i_am_also_a' size='59' value='other (please specify)' onFocus="if (this.value==this.defaultValue) {this.value='';document.donateForm.other.checked=true;}" onBlur="if (this.value=='') {this.value=this.defaultValue;document.donateForm.other.checked=false;}"/>
</fieldset>
</p>

<p>
<fieldset>
<legend>
How should we list your name?
</legend>
List as: <input type='text' id='LMA' name='list_me_as' value='(required)' size='55'  onFocus="if (this.value==this.defaultValue) this.value='';" onBlur="if (this.value=='') {this.value=this.defaultValue;} else {this.style.backgroundColor ='#ffffff';}"/><br /><br />
For Example:
<blockquote>
Dr. & Mrs. John Smith<br />
John & Jane Smith<br />
The Jane Smith family<br />
John Smith & Family<br />
</blockquote>
</fieldset>
</p>


<!-- Insert the remaining required fields -->
<input type='hidden' name='x_fp_sequence' value='<?php echo $sequence; ?>' />
<input type='hidden' name='x_fp_timestamp' value='<?php echo $timestamp; ?>' />
<input type='hidden' name='x_fp_hash' value='<?php echo $fingerprint; ?>' />
<input type='hidden' name='x_login' value='<?php echo $login; ?>' />
<input type='hidden' name='x_show_form' value='PAYMENT_FORM' />

<p>
Thank you for choosing to donate to Lincoln Lutheran through our
online donation page. Click here and you will be transferred to a
secure website to complete your donation.

</p>

<input type='submit' value='Step 2: Continue to Secure Server' onClick="if (document.donateForm.i_am_also_a.value=='other (please specify)') {document.donateForm.i_am_also_a.disabled=true;}"/>

</form>

I think the right solution to this is an Ubercart module, but I was under a time constraint, and decided I could live with something like this for the time being.

Groups:
Login to post comments