Documentation You are here: start » v » 0.7.2 » checkout

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
v:0.7.2:checkout [2011/11/08 02:56] – [Customising which Credit Card types are allowed on your Checkout] adamv:0.7.2:checkout [2017/04/26 07:02] (current) – external edit 127.0.0.1
Line 117: Line 117:
 ==== Required Fields ==== ==== Required Fields ====
  
-You can required a custom field by adding ''fc_required'' to its class (of the ''input''). You can add an error message (which will display if it's left blank) by adding a ''label.fc_error'' with ''for="your_field_name"'', like this:+You can require a custom field by adding ''fc_required'' to its class (of the ''input''). You can add an error message (which will display if it's left blank) by adding a ''label.fc_error'' with ''for="your_field_name"'', like this:
 <code html><label class="fc_error" style="display: none;" for="terms_of_service">Please accept our Terms of Service.</label></code> <code html><label class="fc_error" style="display: none;" for="terms_of_service">Please accept our Terms of Service.</label></code>
 For example, if you wanted to force a Terms of Service acceptance, it'd look like this: For example, if you wanted to force a Terms of Service acceptance, it'd look like this:
Line 159: Line 159:
  
 Pre-populating is done by passing in [[.:cheat_sheet#customer_information_pre-population|specific customer fields]] to [[.:cart|the cart]]. Once the customer fields have been passed into the cart, they will remain there just like [[.:session_variables|session variables]], and when the checkout is loaded the values will be inserted into the appropriate fields on the checkout. Note that this does //not// impact the user's ability to change the data, nor does it impact the customer's ability to checkout as a guest or to create an account. Pre-populating is done by passing in [[.:cheat_sheet#customer_information_pre-population|specific customer fields]] to [[.:cart|the cart]]. Once the customer fields have been passed into the cart, they will remain there just like [[.:session_variables|session variables]], and when the checkout is loaded the values will be inserted into the appropriate fields on the checkout. Note that this does //not// impact the user's ability to change the data, nor does it impact the customer's ability to checkout as a guest or to create an account.
 +
 +===== Adding custom validation to your Checkout =====
 +Often when adding custom fields or doing some advanced customisations, you need to prevent the checkout unless a specific situation has occured. For example, you may need to validate an age of a customer, or prevent the checkout if they haven't filled out a specific text box after selecting a checkbox. 
 +
 +To prevent the checkout from validating (and therefore preventing the checkout from submitting), you simply set the following javascript variable:
 +
 +<code javascript><script type="text/javascript">
 +  FC.checkout.config.isValid = false;
 +</script></code>
 +
 +Setting that variable to false will prevent the checkout from submitting, and obviously, setting it to true will allow an order to complete. Note that if you're using this type of functionality, it's important to test thoroughly as if the ''isValid'' variable gets stuck on false in your javascript logic, your customer's 
 +simply won't be able to check out.
 +
 +As an example, this code will check a custom checkout text input which requires customers type in their age, and checks that they are over the age of 18.
 +
 +<code javascript><script type="text/javascript">
 +function ageCheck() {
 +  var custAge = jQuery("#CustomerAge").val();
 +  if (!isNaN(parseFloat(custAge)) && isFinite(custAge) && parseFloat(custAge) >= 18) {
 +    FC.checkout.config.isValid = true;
 +  } else {
 +    FC.checkout.config.isValid = false;
 +    alert("You must be over the age of 18 to purchase these products");
 +  }
 +}
 +
 +// Run our custom validation before the checkout validates
 +FC.checkout.overload("validateAndSubmit", "ageCheck", null);
 +</script></code>
 +
 +This type of setup can be expanded to show and hide error messages similar to how FoxyCart does with the default fields also.
 +
 +<wrap hi>Make sure that you're setting ''isValid'' to both true and false within your logic. If you just set it to false then the checkout will go nowhere.</wrap>
  
 ===== Customising which Credit Card types are allowed on your Checkout ===== ===== Customising which Credit Card types are allowed on your Checkout =====
Line 172: Line 205:
   FC.checkout.config.validPaymentCards = ["mastercard","visa"];   FC.checkout.config.validPaymentCards = ["mastercard","visa"];
 </script></code> </script></code>
 +
 +You'll also need to update the "pay with credit card" checkout language string in your FoxyCart admin under the language settings.
 ===== Other Checkout Actions ===== ===== Other Checkout Actions =====
 The checkout is primarily used to pay for new purchases, but there are certain other situations that arise that are still handled through the checkout. It's important to understand when your checkout can be used for other purposes so you can design and style accordingly. The checkout is primarily used to pay for new purchases, but there are certain other situations that arise that are still handled through the checkout. It's important to understand when your checkout can be used for other purposes so you can design and style accordingly.

Page Tools

Site Tools