How to display different form fields in 2nd page based on services selection on the first page?

#1

How to display different form fields in 2nd page based on services selection on the first page? I’m new to Axure and got stuck in designing a prototype with above feature. Any suggestion/direction will help greatly. Thanks!

#2

Hi @Chenchu,
You can use Global Variables, to pass values from one page to another.

Depending on the values set for the Global Variables, use Conditional Logic to either:

  1. Show / hide on the fields in the 2nd page
  2. Change the state of a Dynamic Panel that has different configurations of your form in different states.

There are other options, but I would try either of the two above.

#3

Hi Josh

I had tried the above mentioned options and didn’t able to progress. Not sure what I’m missing? Please let me know the other options to achieve the above requested.

Please refer the attached, if it helps.

Thanks!
Tabs_Selection_Test.rp (115.8 KB)

#4

Hi Chenchu,
I’ve revised your document to show a very simple example of what you are trying to accomplish.
Tabs_Selection_Test_working.rp (66.8 KB)

Of course, you can make this a lot more elegant, so hopefully this steers you in the right direction.

#5

Hi Josh,

Thank you for the reply with updated file. It gives me a direction to progress, however I got stuck with, some additional features required in the working file, like: Service 4 can only available with Service 1 and you can only choose Service 2 or Service 3 if you wish to choose in between Service 2/3. User can choose Service 1/2/4 or 1/3/4 or 1/4 or service 1 or service 2 or service 3.

Your guide will help heaps.

Regards,

#7

Hi Chenchu,
It was technically working but you had to refresh each time, although #4 was setting the #3 value, whoops!

I’ve revised it so it’s easier to follow and works the way that you seem to require based on your last comment.
Tabs_Selection_Test_working2.rp (65.7 KB)

What I changed:
Home

  1. Added an OnPageLoad to clear variable values
  2. Simplified the OnClick event to only toggle selection
  3. Added OnSelected and OnUnselected events to set Global Variables

The way I had it before would still work, but this method is better.

#8

Hi Josh,

Thank you for the reply. Just want to check, will it be possible to open a different pages based on the services selection in the first page as need to put an estimate page and direct the user to the results page.

Need to display form as per the services selection on first page.

Thank you!

#9

Hi Chenchu,
Yes.

Only the Home page clears the global variables (OnPageLoad currently sets to “”), so they would be accessible on all pages except the home page. If you remove the OnPageLoad on the Home page, you will experience the “issues” you had mentioned previously.

#10

Hi Josh

I had tried to direct the user to a specific page based on the selection on Home page, but it’s taking only the last case the other case’s are not working. I’m not sure where I’m doing wrong. Please help.

Thank you!
Tabs_Selection_Test_working2.1.rp (94.4 KB)

#11

@Chenchu
Tabs_Selection_Test_working2.2.rp (94.9 KB)

I fixed your file, but I should mention that based on how you’ve chosen to redirect the user, there are a total of 16 permutations. in your file, you only address 3 permutations:

  • 1 + 3 + 4
  • 1 + 2 + 4
  • 1 + 4

I will warn you, that unless you plan to build out all 16 pages this is not a great strategy as you risk confusing yourself further into the project. Depending on your use case there may be better strategies than what I have provided. For instance, a better strategy would be to only have a one or two pages with content that changes depending on which of the 4 options were selected.

Example 1
Let say your site visitor is selecting options that will present them with purchase recommendations.

Good

  • If the visitor does not select an option, do nothing. (home page)
  • If the visitor selects only options that apply to a user, present a user purchase page.
  • If the visitor selects only options that apply to an administrator, present an administrator purchase page.

Better

  • If the visitor does not select an option, present a message on the page. (home page)
  • If the visitor selects only options that apply to a user, present the purchase page with items a user can purchase.
  • If the visitor selects only options that apply to an administrator, present the purchase page with items an administrator can purchase.
#12

Hi Josh,

Thank you for the alert. I’m using the major forms for prototype requirements.
Thank you for the suggestion.

Thank you!

closed #13