web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Apps / Powerapps Components -...
Power Apps
Answered

Powerapps Components - Navigation

(0) ShareShare
ReportReport
Posted on by 218

Hi Folks,

 

Just getting started with Components, really want to migrate over to using them but getting stuck at two points.

 

The first, and most important, is it possible to set a formmode from a component?  For example, if you had a header component with an "Add" and an "Edit" option, how would you do the usual "NewForm()" / "EditForm()" commands?  

Entering them as I normally would doesn't work, trying to create a custom input property with the form name contained within doesn't seem to work.  Is this just not possible?

 

Second problem is passing values from one screen to another via Navigate (eg Navigate(screen1, transition.None, {variable1: Value1}).  Tried a few variations on this without success.  Best work-around I came up with is having the component trip a timer which, on timer end, performs the navigate passing the value taken from the component, which is pretty convoluted and messy.

I've tried googling for hours and the lack of content lead me to believe either I'm missing something obvious or no ones really using components..

 

Cheers!

Categories:
I have the same question (0)
  • Verified answer
    v-yutliu-msft Profile Picture
    Microsoft Employee on at

    Hi @Slaverty ,

    Do you want to use buttons inside component to change form's mode and navigate?

    Since there's no custom action property inside component, so you need to use controls outside the component for these two feathers.

    I've made a similar test for your reference:
    1)use buttons inside component to change form's mode

    Since you want to change form's mode between edit and new, so I suggest you use toggle.

    In component, insert two buttons.

    button1's OnSelect:

    Set(var,"add")

     button2's OnSelect:

    Set(var,"edit")

    create a new custom property:

    8102.PNG

    set component's varvalue:

    var

    outside the component, in the app.

    insert this componnet

    insert a toggle

    set the toggle's Default:

    If(Component1_1.varvalue="add",true,Component1_1.varvalue="edit",false)

    set the toggle's OnCheck:

    NewForm(Form1)

    set the toggle's OnUncheck:

    EditForm(Form1)

     

    Then if you click button1, the form's mode will change to new. If you click button2, the form's mode will change to edit.

    8103.PNG

     

    2)use buttons inside component to  navigate

    in the component, insert button3 and a timer

    set button3's OnSelect:

    Set(var1,"navigate")

    set Timer's AutoStart:

    var1="navigate"

    set timer's duration:

    100

    set timer's OnTimerEnd:

    Set(var1,"back")

    create a new custom property:
    8104.PNG

     

    set the component's navigatevalue:

    var1

    outside the component, in the app

    insert this component, insert another timer

    set timer2's AutoStart:

    If(Component1_1.navigatevalue="navigate",true)

    set timer2's duration:

    200

     set timer2's OnTimerEnd:

    Navigate(Screen1, ScreenTransition.None, {variable1: "test"})

    Then if you click that navigate button, you will navigate to another screen and pass that variable.

    (The reason why I also use a timer inside the component: to change var1 to "back" inside the component after you trigger the action of navigating. Or else the feather of navigating could only work once.)

    8105.PNG

     

     What's more, you could set the toggle and the timer's visible to false.

     

     

    Best regards,

  • Slaverty Profile Picture
    218 on at

    @v-yutliu-msft 

    Hi,

    Thanks for your detailed reply, this really helped a lot, particularly the 2nd option with the timer inside the component and outside.

    It's for header and navigation components, so figure what I'll do is have the button's OnSelect do:

    Set(var: "whatever screen this button represents")

    Then the component timer will start when 

    var <> "RESET"

    OnTimerEnd will then be

    Set(var: "RESET")

    Then the timer outside the component, in the app, would also start when

    Component1.var1 <> "RESET"

    And finally the outside OnTimerEnd will be a switch like

    Switch(
     Component1.var1,
     "HOME", Navigate(HomeScreen),
     "Edit", EditForm(Form1); Navigate(EditScreen)
    ect
    ect
    )

     

    Initial testing all looks positive!  So thanks again.

  • JP-23070531-0 Profile Picture
    16 on at

    Whilst I appreciate your very thorough and detailed answer, what in the actual hell!!!!???? This is not directed at you, but the power app team, why is it not possible to navigate from inside a component!? I want a home navigate button on every screen and I have to use extra variables and timers, seriously. Another case of the Microsofts strikes again, 3/4 of the way to being something great and then mark it done. Happens with pretty much everything Microsoft does and it is so sad and annoying.

  • Slaverty Profile Picture
    218 on at

    Yeah, the components are a bit to get your head around.  If all you're looking for is a single navigation button, using components might be a bit overkill.  I wanted to use them cause I was creating a navigation bar with 6 buttons across about a dozen screens.

    For your home button, personally I would just create one home button on one of your pages, make sure you get it working and looking how you like then just copy/paste it to the other screens you need it on.

    If you want to future proof a bit you can assign variables to your button's design properties (font, colour ect).  This way, if you want to make a design change down the line you'd just need to update your variable and not each of your buttons individually.

  • JP-23070531-0 Profile Picture
    16 on at

    This is basically what I did. Fortunately I do not have that many screens. I created an invisible button over the home button displayed on the component. I lose the click animation but I don't think that will be an issue.

  • Community Power Platform Member Profile Picture
    Microsoft Employee on at

    I came across the same scenario that i need to navigate to the New Form while clicking on the button in the Navigation component. It puzzled me some time and i finally figured out a simple easy way.

    All you have to do is to Enable the Access App Scope of the component. 

    Set the button.OnSelect = Set(varProjectFormMode, FormMode.New);Navigate(ApplicationHeader.ManageProjectScreen, None);

    In the application screen  OnVisible = If(varProjectFormMode = FormMode.New, NewForm(ProjectForm), EditForm(ProjectForm))

     

    Mindyw_0-1632775200092.png

     

    Check out more details about the component scope: https://docs.microsoft.com/en-us/powerapps/maker/canvas-apps/create-component

     

    Hope that helps. 🙂

    Thanks

  • Slaverty Profile Picture
    218 on at

    @Anonymous Thanks for the update.  Looks like this is a feature that was introduced in August this year, will need to keep that in mind for next time, definitely a lot easier than the old method!

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Season of Sharing Community Challenge Winners!

Congratulations to our community stars!

Kudos to our 2025 Community Spotlight Honorees

Expanding mentorship, skilling, and AI innovation

Congratulations to the July Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Apps

#1
WarrenBelz Profile Picture

WarrenBelz 421 Most Valuable Professional

#2
11manish Profile Picture

11manish 153 Super User 2026 Season 2

#3
MS.Ragavendar Profile Picture

MS.Ragavendar 116 Super User 2026 Season 2

Last 30 days Overall leaderboard