One thing to note before hacking your form WP page template:
You should have experience with jQuery, editing your WP page templates and extensive css formatting. Otherwise this technique will be difficult.
My method will not be required if the GF team adds fieldsets (begin and end) options into the form. I'll cross my fingers.
Solution:
Basically the idea requires the use of the dynamic form wizard found here:
http://www.jankoatwarpspeed.com/post/2009/09/28/webform-wizard-jquery.aspx
It requires fieldsets... but we don't have any. So we create some.
1. Download and include the form wizard & jQuery in your header file for the form page.
2. We need to create fieldsets to wrap sections of the <li.gfield> elements.
Count the number of fields you want to include on the "first page" of the form. Then use the following code to insert a fieldset around just those fields:
$("li.gfield").slice(0,2).wrapAll('<fieldset></fieldset>') <!--WE WRAP 2 FIELDS HERE -->
To wrap the next two fields in another fieldset (2nd page of form) just adjust your .slice() function:
$("li.gfield").slice(2,4).wrapAll('<fieldset></fieldset>') <!--WE WRAP 2 MORE FIELDS HERE -->
Once you have wrapped all of your forms wfields in fieldsets to create our form pages we call the .FormtoWizard(); function to produce our multi-paging.
Now all of those things put together in a header script would look like the following:
$(document).ready(function(){
$("li.gfield").slice(0,2).wrapAll('<fieldset></fieldset>');
$("li.gfield").slice(2,4).wrapAll('<fieldset></fieldset>');
$("#gform_wrapper_2").formToWizard({ submitButton: 'mybuttonid' });
});Above code will create a 2 page form from 4 fields.
Sorry if that was hard to follow. I can answer basic questions here if anyone gets stuck.
