Page Templates:Creating a Billing Address Template

From Whirlwind eCommerce Wiki
Revision as of 12:24, 21 October 2008 by 71.163.185.8 (Talk)

Jump to: navigation, search

The billing address template is a form for the user to enter their billing address.

The billing address and shipping address templates are virtually identical. Note that all the fields in the the billing address form refer to the payment array, while the fields in the shipping address form refer to the item array (where the shipping address resides).

Also be sure the redirect success and redirect failure attributes (hidden variables at end of form) are pointed correctly. Unless otherwise required, the redirect failure attribute should point back into the current page (on submission failure, such as invalid or missing information, the visitor will be sent to the redirect failure location and provided with a message detailing the reason for the failure). The redirect success attribute should be the next step in the checkout process - if billing address is before shipping address, then send redirect success to index.php?fa=ORDER.checkoutShipping - if billing is after shipping but before payment, then send redirect success to index.php?fa=ORDER.checkoutPayment.

After creating the template, setup a page for it. Place the pageId of this new page in Settings > eCommerce tab: "Billing Address Page Id"

Sample content is below:


// when called correctly (using fa=ORDER.checkoutBilling)
// the $addressArr array will be passed to this page 
// containing all the fields for the address form
// also $orderArray will be passed with the complete cart data
 
// if using the address book, we need to get the user's address
if($isLoggedIn) $arrAddresses = eV::userGetAddresses("emailAddress,firstName,lastName,company,street1,street2,city,state,zipCode,country,phone1,addressName,addressId");
 
// get the options for the state select field
// pass addressArr['state'] to set the detauly
$stateOptionString = eV::addressStateOptions($addressArr['state']);
 
// get the shipping address from orderArray
// only necessary if using the 'use this address for shipping' option
// pulling from address in first item
$shippingAddressId = $orderArray['items'][0]['sale_addressId'];
 
// display message if there is one
// this variable will be uysed by the system
// to report back any incomplete/ invalid information in the form
if(!empty($message)) echo "<p><font color=red><b>$message</b></font></p>";    
 
// output content management controlled data for the page, if necessary
echo "$title
<br>$subTitle
<br>$copy";
 
 
// display address selections if logged in an using address book
if($isLoggedIn) {
	// here's a nifty javascript function 
	// to allow selection of addresses auto populate the form
	// make sure to adjust to your specific fields!
	echo "
	<script language=\"javascript\">
	<!--
	function popAddress(firstName,lastName,street1,street2,city,state,zipCode,phone1,emailAddress,company){
		formObj = window.document.billingAddressForm;
		formObj.firstName.value = firstName;
		formObj.lastName.value = lastName;
		formObj.street1.value = street1;
		formObj.street2.value = street2;
		formObj.city.value = city;
		formObj.zipCode.value = zipCode;
		formObj.phone1.value = phone1;
		formObj.emailAddress.value = emailAddress;
		formObj.company.value = company;
		for(var i=0;i<formObj.state.length;i++) if(formObj.state.options[i].value == state) formObj.state.selectedIndex = i; 
	};
	// -->
	</script>
	";
 
	// loop thru available addresses
	// $arrAddresses is an array returned by the call to userGetAddresses at beginning
	foreach($arrAddresses AS $row){
		// output address data
		// you can show as little or as much info here as you would like
		echo "<hr>" . $row['firstName'] . " " . $row['lastName'] . "
			<br>" . $row['street1'] . "
			<br>" . $row['street2'] . "
			<br>" . $row['city'] . ", " . $row['state'] . " " . $row['zipCode'];
 
		// create the javascript call to select the address
		// uses the popAddress function created above
		echo "<br><a href=\"javascript:popAddress('" . rawurlencode($row['firstName']). "','" . rawurlencode($row['lastName']). "','" . rawurlencode($row['street1']). "','" . rawurlencode($row['street2']). "','" . rawurlencode($row['city']). "','" . rawurlencode($row['state']). "','" . rawurlencode($row['zipCode']). "','" . rawurlencode($row['phone1']). "','" . rawurlencode($row['emailAddress']). "','" . rawurlencode($row['company']) . "');\">SELECT</a>";
 
	// end arrAddresses loop
	};
 
// end if logged in
};
 
// start address form
// note use securedSiteUrl attribute - this is set in Settings > Site Tab. Use to ensure we go to a secured page
echo "<form name=\"billingAddressForm\" action=\"" . $iProducts['securedSiteUrl']. "/index.php\" method=\"post\">";
 
// now for each of the fields
// note the use of $addressArr array which contains all the values
// $addressArr array is autotically available to the template when called correctly (fa=ORDER.checkoutBilling)
echo "<br>Email Address: <input name=\"emailAddress\" type=\"text\" value=\"" . $addressArr['emailAddress'] . "\" size=\"30\" maxlength=\"50\"/>";
 
// if you choose to use the subcribe checkbox
// and a visitor selects it
// they will be subscribed to the newsletter automatically
// just make sure the input is names "subscribe"
// most clients want it always defaulted to checked
echo  "<input name=\"subscribe\" type=\"checkbox\" value=\"1\" checked=\"checked\"/> Check to Subscribe";
 
echo "<br>First Name: <input name=\"firstName\" type=\"text\" value=\"" . $addressArr['firstName'] . "\"size=\"30\" maxlength=\"50\"/>";
echo "<br>Last Name: <input name=\"lastName\" type=\"text\" value=\"" . $addressArr['lastName'] . "\" size=\"30\" maxlength=\"50\"/>";
echo "<br>Company Name: <input name=\"company\" value=\"" . $addressArr['company'] . "\" type=\"text\" /size=\"30\" maxlength=\"50\">";
echo "<br>Street 1: <input name=\"street1\" type=\"text\" value=\"" . $addressArr['street1'] . "\" size=\"30\" maxlength=\"50\"/>";
echo "<br>Street 2: <input name=\"street2\" type=\"text\" value=\"" . $addressArr['street2'] . "\" size=\"30\" maxlength=\"50\"/>";
echo "<br>City: <input name=\"city\" type=\"text\" value=\"" . $addressArr['city'] . "\" size=\"30\" maxlength=\"50\"/>";
 
// note state is a select input
// use the stateOptionString created at beginning to easily output state options
echo "<br>State:
		<select name=\"state\">
                $stateOptionString
		</select>";
 
echo "<br>Zip/Postal Code: <input name=\"zipCode\" type=\"text\" value=\"" . $addressArr['zipCode'] . "\" size=\"12\" maxlength=\"12\"/>";
echo "<br>Phone Number: <input name=\"phone1\" type=\"text\" value=\"" . $addressArr['phone1'] . "\" size=\"25\" maxlength=\"25\"/>";
 
// heres a handy feature - use this checkbox to dupe the address to shipping opon submission
// note if shipping address is before billing in the process, use the checkbox in shipping instead
// note we are using shippingAddressId which we created beginning of this script from orderArray
echo "<input name=\"copyTo_sale_addressId\" type=\"checkbox\" value=\"$shippingAddressId\" onChange=\"toggleRedirectSuccess(window.document.billingAddressForm.copyTo_sale_addressId.checked);\"/> 
       Use same Billing Address as your Shipping Address";
 
// the following javascript function is handy to change the success target page
// this will skip the shipping address form if checked
echo "
	   <script language=\"javascript\">
			<!--
			function toggleRedirectSuccess(copy2Shipping){
				var fieldObj = window.document.billingAddressForm.redirectSuccess;
				if(copy2Shipping) fieldObj.value = 'index.php?fa=ORDER.checkoutPayment&hideKeyField=1';
				if(!copy2Shipping) fieldObj.value = 'index.php?fa=ORDER.checkoutShipping&hideKeyField=1';
			};
			// -->
		</script>
 
";
 
// submit button to submit the address form
echo "<input type=\"submit\" value=\"continue\">";
 
// required hidden fields for the address form to work
// note the redirectSuccess, redirectFailure fields to tell the system where to go after the form is processed
// redirectOnFailure will almost always loop back into this form
// redirectOnSuccess will go to the next step in the process, which is usually checkoutShipping, unless billing is after shipping than send them to ORDER.checkoutPayment
echo "
<input type=\"hidden\" name=\"fa\" value=\"ORDER.checkoutBilling\">
<input type=\"hidden\" name=\"formAction\" value=\"form\">
<input type=\"hidden\" name=\"addressId\" value=\"" . $addressArr['addressId'] . "\">
<input type=\"hidden\" name=\"redirectSuccess\" value=\"index.php?fa=ORDER.checkoutShipping&hideKeyField=1\">
<input type=\"hidden\" name=\"redirectFailure\" value=\"index.php?fa=ORDER.checkoutBilling&hideKeyField=1\">
";
 
// wrap up our form
echo "</form>";