Hi Kim,

Not sure how much help this is really ;-) But looking at the markup, switching between the tabs, their visibility seems to be controlled by a css class:

I'm by no means a frontend-guru, so I'm not sure if you can tell a given tab to use css class: "tabOn" and set the rest to css class: "tabOff" in the link somehow? ;-)

I just love answering questions with questions.

Thanks Mads!

But how do I register the code on my editcontent.aspx page?

Can I just copy/paste the code into the existing code in that file or do I have to do something in C# or something like that to register it the right place?

/Kim A

That depends :)

Firstly, yes, you have to register a handler in C# to use the code I posted. But you can definitely put the code directly in the editcontent.aspx page with some slight alterations. Personally I do prefer the handler approach though, simply to avoid messing with core files.

Let me know which approach you're planning on taking, I'd be happy to help get everything to work, should be fairly easy no matter what.

Great. Asked my backend colleague and he knew just what to do, so it's working now :)

Thanks Mads!

/Kim A

Awesome :)

Hi again Mads.

Actually I just ran into to a small issue with this functionality.

When I'm on my dashboard I'm linking to different types of document types. All of these document types has the "Gallery"-tab that I want to link to. But, the tab is not in the same position on all of the different document types. So: On doc type 1 the tab is number 2. On doc type 2 the tab is number 4. And on doc type 3 the tab is the last tab before the "Properties" tab.

Would it be possible to link to the correct tab by using the name of the tab instead of the number? Something like this for example:

<a title="Edit this node" href="/umbraco/editContent.aspx?id=1397&tab=Gallery">Edit this node</a>

Or maybe I could link to the right tab if I always knew that the tab was the last tab before the "Properties"-tab on all of the document types.

I hope that you can follow what I'm trying to do :)

Not sure that this can be done at all, but just wanted to hear if you have any experience with this?

/Kim A

Of course it can be done :P

You probably wan't to move the javascript part to a dedicated .js file, otherwise it will get ugly fast. Here is the updated code:

Dashboard:

<a title="Edit this node" href="/umbraco/editContent.aspx?id=1397&tab=gallery">Edit this node</a>

Handler:

if (!path.EndsWith("/editcontent.aspx"))
    return;

var tab = request.QueryString["tab"];
if (!string.IsNullOrEmpty(tab))
{
    bool created;
    var loader = UmbracoClientDependencyLoader.TryCreate(page, out created);
    if (loader == null) return;
    loader.AddPath("Scripts", IOHelper.ResolveUrl("~/Scripts/Modules/"));
    loader.RegisterDependency(1400, "umbraco.tabswitcher.js", "Scripts", ClientDependencyType.Javascript);

    page.Page.ClientScript.RegisterClientScriptBlock(GetType(), "ActiveTab", "<script>var activeTab = '" + tab + "';</script>");
}

JavaScript:

$(function () {
    $("#body_TabView1 > .header li a").each(function () {
        var tabLink = $(this);
        var tabName = $.trim(tabLink.text().toLowerCase());
        if (tabName === activeTab) {
            var tabId = tabLink.closest("li").attr("id");
            setActiveTab('body_TabView1', tabId, body_TabView1_tabs);
        }
    });
});

You can of course tweak the javascript but this works on my machine at least :)

You are the man Mads!

Works like a charm.

Thank you very much :)

/Kim A

Yay :D

Hi again Mads

We just found a strange "bug" in the code above. It seems that the code only works if you are logged into Umbraco with a user of the type "Administrator". Any other user types are just sent to the first tab of the node they are linked to.

Do you have any clue on why this happens?

/Kim A

Hi Kim

That sounds odd.
Just tested this on a vanilla 6.1.6 with a user that's not an admin. Worked with no issues.
Are you sure it isn't a casing issue? Do you get any errors in the console ?

Cheers
- Mads

Yeah, it's very weird. There's no errors in the console as far as I can see.

I tried this on two seperate Umbraco solutions, but with the same "error". One of them was v4.11.8 and the other was on a v4.11.10.

Did you try a user type that you created yourself, or just one of the other "standard" user types?

I tried in different browsers, with different users/user types, clearing cache, also tried on diferent machines etc., so I don't think it's caching. Otherwise it would cache like crazy :)

/Kim A

Ok, just tried the same things on an 4.11.6 installation.
Also tried with a user belonging to a custom user type, still worked flawlessly.

If you are *not* running in debug mode, then yes, the cache can be very aggressive, since ClientDependency caches stuff to the disk, default location at -> /App_Data/TEMP/ClientDependency. Try clearing that out perhaps.

The next step is to start debugging. Are you following the examples and having a separate javascript file, eg. umbraco.tabswitcher.js ? If so, try and add a few console.log parts to see where the problems starts, for example:

var tabName = $.trim(tabLink.text().toLowerCase());
console.log(tabName, activeTab);

What does that give you? And remember not to get bitten by caching issues :P

Cheers
- Mads

Hi Mads

We tried debugging this way:

$(function () {
  $("#body_TabView1 > .header li a").each(function () {
    var tabLink = $(this);
    var tabName = $.trim(tabLink.text().toLowerCase());
                         console.log(tabName, activeTab,"test");
    if (tabName === activeTab) {
                             console.log("Vi er inde");
        var tabId = tabLink.closest("li").attr("id");
                             console.log("TabId",tabId);
        setActiveTab('body_TabView1', tabId, body_TabView1_tabs);
    }
  });
});

The above debugging gave the following result in the console, with both the admin- user type and with another user type:

indhold kvalitet test 
tilvalg kvalitet test 
selvbetjening kvalitet test 
relateret indhold kvalitet test 
opmærkning kvalitet test 
script kvalitet test 
seo kvalitet test 
kvalitet kvalitet test 
Vi er inde 
TabId body_TabView1_tab08
statistik kvalitet test
egenskaber kvalitet test

So the code finds the right tab "bodyTabView1tab08", but it just doesn't switch to that tab when you're any other user type than administrator.

Does that give you anything?

/Kim A

Hi Kim

Ok, that's seriously odd :P Could you try and execute the following line directly in the Chrome console, when on the given page?

UmbClientMgr.contentFrame().setActiveTab('body_TabView1','body_TabView1_tab08', UmbClientMgr.contentFrame().body_TabView1_tabs);

And then see if you can switch the tabs manually. Also, try checking the id of the li tab elements, do they have the id's we are expecting? They should look something like this:

<li id="body_TabView1_tab01" class="tabOn"><a>...</a></li>

Cheers

Hi again Mads

Just tried excecuting the code manually in the Chrome console, when standing on a given page. When excecuting the script on the page manually, the tab switches to the right tab as expected. Damn that's strange :-/

/Kim A

Indeed it is :P

Ok, just for the fun of it, try wrapping the code in a timeout like so:

$(function () {
    setTimeout(function() {
        $("#body_TabView1 > .header li a").each(function() { ... });
    }, 2000);
});

is working on a reply...