How to highlight left navigation when we select the list view

Hi Pankaj and All,

Ok. We will try with SPFX this also. How to close or mark as answers

Thanks,

Harish Patil

Yes, you can achieve this using an SPFx Application Customizer.

Steps to Implement:

1. Create an SPFx Application Customizer
   This will allow you to inject custom navigation into your SharePoint pages.
2. Track the Current URL
   Use window.location.href or window.location.search to detect which view is currently active.
3. Define Navigation Items with View IDs
   Create a list of navigation links, each associated with a specific view ID.
4. Apply Styling to Highlight the Active Item
   Use conditional logic to apply an active class to the navigation item that matches the current view.
5. Store Navigation Items in a SharePoint List
   This allows for dynamic updates and easier management of navigation links without redeploying code.

Hi Pankaj and All,

But this is working on SharePoint 2013. This means it is working on SharePoint 2013 but not SharePoint Online.

Is here any way achieve this SPFX.

Thanks,

Harish Patil

It doesn't seem possible out-of-the-box (OOTB) because SharePoint navigation highlights the menu item that matches the URL in the browser's address bar. When you switch views within a list, the URL only updates the view ID (e.g., ?viewid=xyz) without changing the base path. As a result, the navigation doesn't recognize it as a different page and doesn't update the highlight accordingly.

Hi harishpatil​ 

there is no option available in SharePoint to highlight the selected view...

Best, Dave

It doesn't seem possible out-of-the-box (OOTB) because SharePoint navigation highlights the menu item that matches the URL in the browser's address bar. When you switch views within a list, the URL only updates the view ID (e.g., ?viewid=xyz) without changing the base path. As a result, the navigation doesn't recognize it as a different page and doesn't update the highlight accordingly.

You can consider using an SPFx extension to detect the active view and dynamically apply CSS for navigation highlighting based on the current view.