Splitting web forms across multiple pages

Question

I have a really long Adobe Business Catalyst web form that I need to split across multiple pages so that it doesn't look so long. I'm using the instructions at the following url to put it together.

http://kb.worldsecuresystems.com/kb/splitting-web-form-across-multiple.html

The instructions say to create a separate web page for each part of the form and then link the forms together using a modified action url.

The form is a membership application form and the user needs to choose a level of membership on the first form using a drop down menu. They don't pay until the 5th form which is where the credit card details and the amount field will be located. So my question is, if they're choosing the amount on the first form, how can I store that amount in order to populate the amount field on the 5th form?

Also, we're asking for Home Address, Work Address and PO Box Address. Each of these will be on a separate page. The problem is that on the last page will be the information for the credit card and because we're with Paypal they require a billing address to be submitted. So after asking the user for all those addresses, I don't really want to ask for a billing address on top so is there a way to store, say the Work address (on page 3), and then use that to populate the billing address on page 5? I know that I'm making an assumption that they want their work address to be the billing address but I'm not sure how to know the information any other way.

Also if each submit button on each of the pages is being submitted to the next form like this:

<form name="catwebformform23080" method="post" onsubmit="return checkWholeForm23080(this)" enctype="multipart/form-data" action="/FormProcessv2.aspx?WebFormID=70776&amp;OID={module_oid}&amp;OTYPE={module_otype}&amp;EID={module_eid}&amp;CID={module_cid}&PageID=/Home-address">

...then will that mean each of the forms will be logged into the Business Catalyst database as a separate case? Can I also assume that the payment won't go through until the 5th form where the billing and credit card details will be located?

Thanks in advance.

Answer 1

how can I store that amount in order to populate the amount field on the 5th form?

You can persist small amounts of data using the methods Business Catalyst automatically provides in /CatalystScripts/Java_Cookies.js:

createCookie(), readCookie(), and eraseCookie().

You may have an easier time by keeping all the fields together on one form on one page, and using something like jQueryUI Tabs to group the form elements.

then will that mean each of the forms will be logged into the Business Catalyst database as a separate case?

No, BC will apply each of them to the same customer and case. From the KB article you linked:

You have the ability to create a Web Form that can be split across multiple web pages but will be added to the same customer and case

Can I also assume that the payment won't go through until the 5th form where the billing and credit card details will be located?

Correct. Do note that as soon as the first form is completed, the only workflow notification will be triggered - you will not receive further notification if the customer completes any of the next forms.

Answer 2

I realise this is an old question but thought I'd put my 2 cents in.

It's worth noting that multi-page forms only result in a single auto-responder email being sent - that of the first form in the series of forms. The auto-responders of all subsequent forms will not be triggered.

Regarding:

I know that I'm making an assumption that they want their work address to be the billing address but I'm not sure how to know the information any other way.

...you could use a checkbox for the customer to select the address they wish to use as the Billing Address. Ticking a box could apply a class to all the address fields within that section and then that address is carried over (somehow - using cookies or query strings?) to populate the Billing Address in the final form.

Possible Secure Zone + {module_} Solution

Disclaimer: 2 things: 1) I haven't tested this, but it might give someone a push in the right direction. 2) This uses a Secure Zone as part of the solution - not sure how compatible it is with your scenario, given that you're already signing up a customer to a Secure Zone.

An option could be to use BC's Secure Zone functionality; when a user is signed into a Secure Zone, you can use certain modules to pre-populate form fields.

Steps you would take are:

1. Create a Secure Zone. (We'll call it General Zone).

2. Set the first form in the series to subscribe the customer to General Zone.

   (You would need to use a standard web form and in the Edit Properties section select the General Zone from the dropdown list.)

   Upon submission of this form, the customer is subscribed and automatically logged in to General Zone. No Username or Password required.

3. Insert and hide the Billing Address fields on the Home Address and Work Address form pages.

   (I don't know how you'll get on with using a PO Box for a Billing Address - you'd need to look into this.)

4. Set up a checkbox on both Home Address and Work Address form pages (as mentioned above) and use this to populate the fields of the hidden Billing Address section (instructions here). This should submit the Billing Address to be retrieved later.

   (You would need to edit the form validation JS to prevent BC from checking whether the Billing Address fields are completed as they would obviously be blank on either the Home Address or Work Address form page.)

5. On the payment form (page 5), use {module_billingaddress}, {module_billingcity}, {module_billingzip}, {module_billingstate} and {module_billingcountry} to automatically populate the Billing Address fields. These modules will retrieve the Billing Address last submitted by that customer. (This is the bit I haven't tested - will the system allow Billing Address info to be submitted when it is not part of an order?)

Hopefully that is of some use to someone.