Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature: Multi Page Form Support #259

Merged
merged 1 commit into from
Feb 10, 2024

Conversation

smg6511
Copy link

@smg6511 smg6511 commented Dec 1, 2021

What does it do?

Changes how hasSubmission() is evaluated to allow multiple submit buttons to post the current form page (relevant in multi-step/page forms).

Why is it needed?

Multi step forms that span multiple pages are currently not possible and need a mechanism to persist data across pages.

Related issue(s)/PR(s)

There is a companion PR on the Formalicious repo (PR 18)

Example Form Template

To illustrate how this is set up, below is a template for a working form using the proposed feature. Note how the standard submitVar property is still used as it always has been, while additional buttons for navigating backward or to a specific step are appended with _[postfix].

<form action="[[!+currentUrl]]" id="form-[[!+id]]" method="post" enctype="multipart/form-data">
	<div class="grid-container fluid">
        <div class="grid-x grid-padding-x">
			[[!+step
				:lt=`[[+formaliciousSteps]]`
				:then=`<div class="form-step-navigation">[[!+formalicious.navigation]]</div>`
				:else=``
			]]

    		[[!+formalicious.form]]

			<div class="form-pagination">
			[[!+step
				:neq=`1`
				:then=`
					<button type="submit" class="button btn--prev" title="[[%formalicious.prev? &namespace=`formalicious` &topic=`default`]]" name="[[!+submitVar]]_prev" value="[[!+submitValPrev]]">
        		[[%formalicious.prev? &namespace=`formalicious` &topic=`default`]]
		    		</button>
				`
				:else=``
			]]
    				<button type="submit" class="button btn--next" name="[[!+submitVar]]"  title="[[!+submitTitle]]">
	        		[[!+submitTitle]]
	    			</button>
			[[!+step
				:lt=`[[+formaliciousSteps]]`
				:then=`
					<button type="submit" class="button btn--last" title="Skip to Last Step" name="[[!+submitVar]]_last" value="[[!+submitValLast]]">Skip to Last Step</button>
				`
				:else=``
			]]
			</div>
		</div>
	</div>
</form>

Changes how hasSubmission() is evaluated to allow alternate buttons to submit the form (relevant in multi-step/page forms)
@MrRoco MrRoco merged commit 9a56fea into Sterc:develop Feb 10, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants