Hi Community!
I ran into this a few months back but was asked again. In the Classic UI I was able to go to “Screens” in a Customization package and drag the tab order around so the first tab would be the new default tab. In the modern UI I can use the Screen Configuration tool to move the tab order in a similar way but even if I move a tab to the 1st, when I open the page it defaults to the original tab that defaulted.
Appreciate any feedback or guidance!
~Chris
Solved
Modern UI changing default tab on a screen.
Best answer by cdiangelo46
To answer my own question for others reference, and this was neither graceful nor clean. I would recommend exporting your package before proceeding with what I did so you can restore easily if needed.
- Add Existing Screen to Screens. In my case it was PM301000 (Projects)
- Expand Screen and select ModernUI Editor
- On the HTML tab Ctrl+F for “qp-tabbar”
- Change the “active-tab-id=” value to the name of the tab you want it to default. This may also require you to do an additional Ctrl+F for “qp-tab”. For me it was “BalancesTab”
- Save the change. You will probably receive an error because there is some sort of bug here.
- Return to the Customization screen and export your package.
- Unzip the Package
- Drill into the unzipped folder structures. In my case it was ...screens\PM\PM301000\extensions. Open the html with notepad.
- The generated modified code is incorrect. Overwrite it. I used…
<template>
<qp-tabbar modify="#ProjectProperties_tab" active-tab-id="BalancesTab"></qp-tabbar>
</template> - Zip up the folders in the same way it was extracted, this means the Custom.Zip should have screens and project.html
- Upload/Replace existing Customization Package
- Publish (and I do with scripts since I’ve been running into ModernUI issues related to not doing this)
- This will default the tab regardless of the order of the tabs on the screen. You can use the Screen Configurator to change the tab order.
Hope this helps someone.
Hi
The good news is there's a straightforward fix:
In your Customization Package, go to Screens and open the layout editor for the screen in question. Find the PXTabItem control for the tab you want to load as default, and set its Selected property to True (making sure no other tab has that property set). This works reliably in both Classic and Modern UI since it sets the default at the source level rather than the display layer.
If it turns out the graph or BLC code is overriding the tab selection programmatically, we may need to make a small code customization — but the above fix should take care of it in most cases
Moderator note - Content above was AI generated per author
+16This works reliably in both Classic and Modern UI since it sets the default at the source level rather than the display layer.
+16The problem with using AI for things without testing them and not properly indicating that 1) AI suggested it and 2) it’s not tested is that any future AI-queries will now see your post as fact.
To prove this point, I asked AI basically the same question as OP this morning. Here is the response:
It referenced your post (only several hours old) as its main premise for its response.
So I pushed it to justify the answer, which it did, despite the fact that I had called the fact that it may have been AI-generated:
This is the real problem I have with AI being used on a site like this, but in reality, it’s a human problem. Please don’t post ‘factual’ answers that you haven’t actually tested. If you don’t have time to test, then indicate in your answer that it’s a suggestion. For instance, “You could try...”
Hi
The good news is there's a straightforward fix:
In your Customization Package, go to Screens and open the layout editor for the screen in question. Find the PXTabItem control for the tab you want to load as default, and set its Selected property to True (making sure no other tab has that property set). This works reliably in both Classic and Modern UI since it sets the default at the source level rather than the display layer.
If it turns out the graph or BLC code is overriding the tab selection programmatically, we may need to make a small code customization — but the above fix should take care of it in most cases
Nasir, thank you for responding. I did my due diligence before posting on the community and consulted Claude Opus. I received a similar response but didn’t see the fields being referenced that it recommended I modify. So I came to the community for first hand knowledge since AI misguided me. I also asked AI where it got it sources from and though it referenced some sites that had good information about the modern UI none of the sites tackled this specific issue. If you do manage to get this to work I’d appreciate a quick screenshot of what you did. Thanks!
+16Using a screen extension to reorder a tab to be first does in fact also change that it is active first.
It seems that it's mostly a UI / UX problem when using the tab reorderer.
To answer my own question for others reference, and this was neither graceful nor clean. I would recommend exporting your package before proceeding with what I did so you can restore easily if needed.
- Add Existing Screen to Screens. In my case it was PM301000 (Projects)
- Expand Screen and select ModernUI Editor
- On the HTML tab Ctrl+F for “qp-tabbar”
- Change the “active-tab-id=” value to the name of the tab you want it to default. This may also require you to do an additional Ctrl+F for “qp-tab”. For me it was “BalancesTab”
- Save the change. You will probably receive an error because there is some sort of bug here.
- Return to the Customization screen and export your package.
- Unzip the Package
- Drill into the unzipped folder structures. In my case it was ...screens\PM\PM301000\extensions. Open the html with notepad.
- The generated modified code is incorrect. Overwrite it. I used…
<template>
<qp-tabbar modify="#ProjectProperties_tab" active-tab-id="BalancesTab"></qp-tabbar>
</template> - Zip up the folders in the same way it was extracted, this means the Custom.Zip should have screens and project.html
- Upload/Replace existing Customization Package
- Publish (and I do with scripts since I’ve been running into ModernUI issues related to not doing this)
- This will default the tab regardless of the order of the tabs on the screen. You can use the Screen Configurator to change the tab order.
Hope this helps someone.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.