Portal | Homepage | Blog

Using Single Form Customization as a waiver


#1

I am trying to use Single Form Product Customization as a waiver or agreement to terms (checkbox to agree). Is it possible to prompt the form AFTER the item has been added to the cart? (possibly as a popup window) Instead of being shown on the actual product page?


#2

That’s fairly easy to do if you’re using the bootstrap framework as it takes the hassle out of configuring the popup etc.

Put this code at the top of your product page and just exchange the product fields to filter the affected products based on your needs. I use it at a department level but you might have different needs. You’ll obviously need access to Nitroscript to perform this.

I don’t have a checkbox included in this example but you could add a dummy checkbox fairly easily that could prevent the accept button on the popup from firing until the checkbox is selected.

{if (product['whatever_field'] eq 'whatever_value')}
×

Purchase Acceptance

Please Note: By purchasing this {product['whatever_field']} , you acknowledge and agree to the following terms:

  1. I confirm that......
  2. etc
  3. etc
Close Accept Terms
{endIf}

You’ll need to close the popup once the accept button is clicked so the easiest way is to add this javascript after the popup code or at the bottom of the product page template. You could easily expand on this should you want to perform any other actions once the accept button has been pressed. i.e change the button colour on the product page on added etc.


The last step is to replace the standard add to cart button from the buy template so that it fires the popup instead of adding the product to the cart as that is now being done via the popup.

In the buy template you’ll need to use the same filter rule you are using on the popup so that you can target the correct (same) products that require the popup, obviously ignoring other products.

{if (product['whatever_field'] eq 'whatever_value')}
//include your current buy button in this section.
{else}
Add to Cart
{endIf}

Note: I’ve used my own pre-configured classes so you may need to tweak it slightly to suit your needs. Hope it helps.

regards,
Andy.


#3

Lovely to see how people use code imaginatively on the platform.

The only thing that I will add to Andy’s comment is that the unmodified add to button on a single form customization product page has a built-in ajax call that gets the server to validate the form before submitting the form.

This can be found in the unmodified Buy Customizable Product Panel - Single Form

        <a href="javascript:void(0)" onclick="if (validateQty('{getLanguageString("ERR_INVALID_QUANTITY")}','{getLanguageString("PRODUCT_SORRY_OUT_OF_STOCK")}','{getLanguageString("PRODUCT_ENTER_LOWER_QTY")}')) { submitNscFormTemplate('{pageproperty["productcustomizationformname"]}', 'frmMain') }; return false; " class="btn btn-lg btn-primary add-to-cart" id="add-to-basket-button">

The important js function there is submitNscFormTemplate() which makes the ajax call and, if valid, submits the form.

James