Power Apps

Is there a way to add a button to the menu bar of a SharePoint list form?

(2) Share

Report

Posted on by Trout19

395

Is there a way to add an additional button to the nav bar of the SharePoint List form.

Categories:

Building Power Apps

I have the same question (0)

All responses (4)

Answers (0)

Suggested answer

RobotRising 402 on at

Like (0)

Report
Yes, it is possible to add a custom button (such as the "Cancel Request" button you highlighted) to the command bar (navbar) of a SharePoint List form. This can be done by customizing the list using Power Apps or using SharePoint JSON formatting to modify the UI.

Here’s a breakdown of both approaches:

1. Using Power Apps to Customize the Form

If you switch to using Power Apps to customize the SharePoint list form, you can add custom buttons directly in the app interface:

Steps to add a button in Power Apps:

Open the SharePoint List.

Click on Integrate > Power Apps > Customize forms.

In Power Apps Studio, you can add a new button to the form by going to the left panel and selecting Insert > Button.

Once you add the button, you can write a formula for the OnSelect property of the button to handle specific actions (e.g., canceling the request, submitting the form, etc.).

Save and publish the Power App form back to SharePoint.

2. Using SharePoint JSON Formatting to Add Custom Actions

SharePoint allows you to use JSON formatting to customize the appearance and functionality of list views and command bars (such as adding custom buttons).

Steps to add a button using JSON formatting:

Go to the SharePoint list.

Click on the gear icon (settings) > List settings > Advanced settings.

Ensure that custom scripting is enabled.

Back in the list, select the view where you want to add the button, then click on the View dropdown and select Format current view.

In the formatting pane, add the JSON code to insert the custom button. You can use the "customRowAction" property to define what happens when the button is clicked.

Example JSON for a button might look like this:

{ "commandBar": { "commands": [ { "key": "customCancelButton", "text": "Cancel Request", "iconName": "Cancel", "onClick": { "action": "customAction", "parameters": { "message": "You clicked the cancel button!" } } } ] } }

This JSON code would add a "Cancel Request" button that displays a message when clicked. You could customize the action to suit your requirements (like triggering a workflow or redirecting the user).

Which Method to Choose:

If you need more advanced logic (e.g., interacting with multiple fields or running specific workflows), Power Apps is likely the better option.

For simpler customizations that don't require building complex logic, JSON formatting can be quick and effective.

Robot Rising

Was this reply helpful? Yes No
Trout19 395 on at

Like (0)

Report

Great Thanks, I am a little unsure how or where I put the code.

This is what I am looking at.

Was this reply helpful? Yes No
Trout19 395 on at

Like (0)

Report
Ok, i figured out where to put it, but when i try to add code, nothing happens. This is the code I am using

{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json", "commandBarProps": { "commands": [ { "key": "customButton", "text": "My Custom Button", "iconName": "Add", "onClick": { "action": "defaultClick", "parameters": { "url": "https://your-custom-url.com" } } } ] } }

After I press save nothing happens. Am i missing a step to get it to show up?

Was this reply helpful? Yes No
timl 36,391 Super User 2025 Season 2 on at

Like (0)

Report

Hi Trout19

Whist it's possible to add a button using JSON, I don't think it's possible to configure the button to call a Power Apps formula.

As per the documentation, you could execute a Flow by specifying executeFlow, but there wouldn't be any way to interact with your Power Apps form.

https://learn.microsoft.com/en-us/sharepoint/dev/declarative-customization/formatting-syntax-reference#customrowaction

One thing to note is that you want to override the default behaviour of the Cancel button, you can do that via the OnCancel property of the SharePoint integration object.

Was this reply helpful? Yes No