Motivation[edit | edit source]
You have a very large form and your initial load times are very long. You want to be able to break a large form into multiple forms.
Method[edit | edit source]
To get the first part of a large form to load we will break the form into multiple parts and only load what appears to be the first tab of a multi-part form. When the user selects the second tab we will save all the data on the first tab and load the second tab. This way if the user want to only make a simple change to the form only the logic for a single tab needs to be loaded.
Example[edit | edit source]
We will use a series of triggers that are styled as file tabs. Each trigger will perform two actions: it will run a save submission and it will then load the next part of the form. The forms will be styled so that it will appear to the user they are just changing tabs.
Here is the sample code from each of the triggers:
<xf:trigger appearance="minimal" class="tab2"> <xf:label>Part 2</xf:label> <xf:action ev:event="DOMActivate"> <xf:send submission="save"/> <xf:load resource="edit-2.xhtml" show="replace"/> </xf:action> </xf:trigger>