How to redirect using ActionLink to specific View tab region in ASP .NET MVC

Question

I need to make an ActionLink that redirects to the previous page, but the previous page is divided in 5 tabs. So for the URL say

host/Admin/AdminMain

which has the tabs, when I hover over tabs the link appears to be

host/Admin/AdminMain#tabs-1
host/Admin/AdminMain#tabs-2

and so on.

In tabs-2 I have a link to another View, like host/Admin/SomeController, and there I need to create the ActionLink in the View that redirects me back to tabs-2, instead of tabs-1 as it does. The ActionLink right now looks like this:

@Html.ActionLink("Back to Main", "Index", "AdminMain")

How can I specify to redirect me to #tabs-2?

Answer 1

The #tabs-2 portion is called the "fragment" of the URL. It's not actually part of the URI for the resource, and is only used client-side to "jump" the user to portion of the document with that id.

However, something like tabs require JavaScript to function, and the browser cannot automatically switch to a tab based on the fragment, because it doesn't know how to do that. You'd need to write some JavaScript read the fragment and then attempt to activate the appropriate tab, using whatever library you're using for that.

(function () {
    var fragment = location.hash;
    if (fragment !== '') {
        // activate tab with that id
    }
})();