Power Pages

Unanswered

Direct user to relevant page based on dropdown selection

(0) Share

Report

Posted on by inanoffice23

299 Moderator

Hello,

In Power Pages, based on dropdown value the user selects, I want to redirect user to the relevant page, it could be 5 other pages

I have 25 basic forms, I am passing the id parameter from one to another

Dropdown value has values 1, 2, 3, 4, 5 - I am not sure where to specify go to to an HTTPS page, if value == 1, then go to https: url1, if value ==2, then go to url2

Code below hides/shows field based on user selection

$(document).ready(function () {

$("#querytype").change(onDisplaySectionChange);

onDisplaySectionChange();

});

function onDisplaySectionChange() {

var varQuery = $('#querytype').find("option:selected").text();

if (varQuery === "1" || varQuery === "2"){

$('#querytype').parent().parent().hide();

$('#fieldtohide').parent().parent().hide();

}

else {

$('#fieldtohide).parent().parent().show();

}

Code below has a 'Previous' page button

$(document).ready(function () {

$("#EntityFormPanel").eq(0).append("<button type='button' id='btnReturn' class='btn' style='color:#fff;background-color:#0B7F99;border-color:36f;' onclick='exitApplication()'>Previous</button><br><br>");

});

function exitApplication() {

var prevurl = "{{ request.url | base }}{{ page.parent.url }}?id={{request.params['id']}}&relid={{request.params['relid']}}";

window.open(prevurl, "_self");

}

Below I try to insert the 'go to a different page, but it then throws an error in the next basic form, saying we can't find the form', and it depends what code I add, it doesn't remember the previous page and it goes back to the main page

Culprit line: window.location.href = "http://stackoverflow.com";

$(document).ready(function () {

$("#querytype").change(onDisplaySectionChange);

onDisplaySectionChange();

});

function onDisplaySectionChange() {

var varQuery = $('#querytype').find("option:selected").text();

if (varQuery === "1" || varQuery === "2"){

$('#queryytype').parent().parent().hide();

$('#fieldtohide').parent().parent().hide();

window.location.href = "http://stackoverflow.com";

}

else {

$('#fieldtohide).parent().parent().show();

}

$(document).ready(function () {

});

function exitApplication() {

var prevurl = "{{ request.url | base }}{{ page.parent.url }}?id={{request.params['id']}}&relid={{request.params['relid']}}";

window.open(prevurl, "_self");

}

How can I redirect user to the correct page, and where would I place the code, is in the Javascript basic form, or in the 'submit' button?

How can I ensure that it remembers the previous page properly?

Thank you

Categories:

Design & build

I have the same question (0)

All responses (7)

Answers (0)

oliver.rodrigues 9,368 Most Valuable Professional on at

Like (0)

Report

Hi, have you considered using Multistep Forms?

You can define Conditional Steps that would redirect the user to expected step, and this would keep track of the previous step.

Was this reply helpful? Yes No
inanoffice23 299 Moderator on at

Like (0)

Report

Yes, it was my first option, however when adding 8 forms and a couple of conditional steps, I seemed to have reached some sort of 'hidden' limit, as it was throwing the last form out of the multistep form, and at some point even though I had 8 steps, when re-adding it to the page, it would only show 2, I wished Microsoft would clarify the limit, so we can skip that option straight away. (posted it in here Re: How many Step forms can you add to a Multiform... - Power Platform Community (microsoft.com))

I can't seem to redirect user with dropdown to another page, as that 'breaks' the connection and the parameters aren't being passed, so at the moment I did: 4 basic forms, 'hide/show' with a lot of Javascript if and switch statements & functions to hide form sections, the problem is the last basic form has 12 possible forms that user might or might not have to fill. I added 'tab' components to form number 4, so it would retain the parameters and so it would be 'the end' for every scenario.

Now the issue is that it shows either as a very long page, or if I do the 'autogenerate steps from tabs', it will force every single user to go through all the 12 forms, even if the contents are hidden

So back to square 1, how do I ensure that the form is submitted, and users don't have to see irrelevant tabs, or having to have all the forms in one long page?

Was this reply helpful? Yes No
oliver.rodrigues 9,368 Most Valuable Professional on at

Like (0)

Report

Do you still have the configuration you used for the multistep forms? because that "limit" doesn't exist afaik, so it should have worked fine.

One thing to note here is that every when you create a record based on a Multistep Form, this creates another record of "Multistep Form Session (adx_webformsession)".. I find that if you are making changes to the Multistep Form configuration after creating records, the sessions get all confused because they might have lost their path basically.

What I do when making changes to the Steps definition, is make sure to delete the Session records (assuming you are doing this in DEV/TEST) to avoid that kind of issue.

Was this reply helpful? Yes No
inanoffice23 299 Moderator on at

Like (0)

Report

Thank you Oliver, I did wonder why sometimes the form behaved so strangely. I have to deliver the project asap so I had to move on and do it all with basic forms and use Javascript to hide sections/fields instead. I don't think I can tackle the 'direct user to a different page based on dropdown value' without breaking the connection, thus creating 2 dataverse records, so sticking to one way forward, one form at a time

Was this reply helpful? Yes No
Fubar 8,338 Super User 2025 Season 2 on at

Like (1)

Report
You have a couple of different options
Multi Setup form
JavaScript redirect on the selection of the Dropdown to different pages
Use Liquid to control the Form to load

//For JaveScript redirect <script> window.location.href='./page/?id=.....&param1=.....' </script>

For the Liquid option
Have different Forms for your different types (to minimise show/hide etc)
In a new Web Page use Liquid (if or case) to load a specific form. Use the "id" from 3 below to get the value from the dropdown and based on that value load the correct form.
On your first form with the Dropdown, set its "On Success" settings to redirect to the new Web Page in 2. (tick the "Append Record ID To Query String" and give it a name e.g. id
https://learn.microsoft.com/en-us/power-pages/configure/liquid/liquid-objects#request
https://learn.microsoft.com/en-us/power-pages/configure/liquid/liquid-objects#entities
https://learn.microsoft.com/en-us/power-pages/configure/liquid/dataverse-liquid-tags#entityform
https://learn.microsoft.com/en-us/power-pages/configure/liquid/control-flow-tags

Was this reply helpful? Yes No
inanoffice23 299 Moderator on at

Like (0)

Report

The Liquid options seems rather complex compared to Javascript, how would you pass the parameter with the window location? Is there a sample where I can see the whole code?

Was this reply helpful? Yes No
inanoffice23 299 Moderator on at

Like (0)

Report

Although checking it seems that the safest way to pass parameters is with POST which is not possible with window location, I wished Microsoft could implement an easy way to direct user to another page without losing the parameter for basic forms. The multistep form didn't work for me as I have too much data but thank you, Javascript saves the day so far

Was this reply helpful? Yes No