Navigate to Dashboard JS API In Code Mode

Lex Clay shared this problem 6 months ago
Defect Logged

Hi Fishies,

Is there a way using any of the apis exposed in code mode to navigate to another dashboard? or trigger the click even on the tab div?

...I have tried just triggering the click event of the tab div but it's expecting some variable, I thought maybe the element itself & although passing that did stop any errors in the console, it also didn't actually navigate to the associated dashboard. If you can tell me exactly what that listener is expecting, I'd happily just trigger that event.

Use Case: We have a custom vertical navigation menu on the side of the dashboard that currently changes the href location with the publishUUID of the dashboard the user wants to go to. This works ok, but does add some wait time for the next dashboard to render as the page reloads entirely, it would be much smoother if we were able to trigger the normal navigation event.

Many thanks.

Lex

Comments (2)

photo
1

Hi Lex,

Thanks for contacting Yellowfin!

There might be more than one solution you could try to navigate to a separate dashboard. I ran this past our consultants and we came up with three possible avenues:

  • You could use an action button, which can hyperlink to a different dashboard
  • You could use go to URL and then use the dashboard entry point URL.
  • Alternatively, there is an API call for loading a Dashboard, called loadDashboard() - is that what you are looking for?

Let me know if any of those methods help.

Kind regards,

Chris

photo
1

Hi Chris,

loadDashboard won't work within code mode because it needs an element to load the dashboard into as one of the required variables. It's built for embedding content only by the looks of it.

I might be misunderstanding but I don't see an option for the action button to link to another dashboard...another subtab or report yes (I tried entering the dashboard UUID in go to report but it doesn't work...unsurprisingly, it calls RunReport.i4 rather than RunDashboard.i4.

/b88462604dd6df9c580ac70872fd86af

Go to URL is essentially exactly the same thing I'm doing now where it causes the entire page to reload.

photo
1

Hi Lex,

Sorry if I'm misunderstanding you, are you saying that Go to URL isn't working correctly when you use the URL for the dashboard you want to navigate to? It will load another page - does it retain the same tab token?

Kind regards,

Chris

photo
1

Hi Chris,

Quiest way for you to see the difference in behaviour I'm describing is to navigate to another dashboard using the top bar nav, then again using the option in the hamburger menu. With the former, only the new dashboard loads, with the latter, the entire browser window loads. I want to replicate the former.

If it's easier, happy to jump on a zoom with you chap & I can show you exactly what I mean.

Lex

photo
1

Hi Lex,

Sure thing, are you available tomorrow for a call? Let me know and I'll send over an invite.

Kind regards,

Chris

photo
1

Hi Chris,

Any time after 1100 GMT is fine.

Lex

photo
1

Hi Lex,

I realise this is short notice but how does 11:00 sound?

Chris McCarthy is inviting you to a scheduled RingCentral meeting.

Topic: RhinoIT meeting Time: Jan 27, 2022 11:00 AM Universal Time UTC


Join from PC, Mac, Linux, iOS or Android: https://meetings.ringcentral.com/j/1446184964 For the best audio experience, please use computer audio.

Kind regards,

Chris

photo
1

Yep I should be able to jump on then chap

photo
1

Hi Lex,

Thanks for joining me just now and showing me the issue. As you said, it looks like we just need to find out what variable the onClick event is expecting when clicking on a favourited dashboard so that you can implement it in the same way in dashboard code mode.

I'll see if I can get an answer from the dev team asap.

Kind regards,

Chris

photo
photo
1

Hi Lex,

The dev team got back to me over the weekend and I have some good news and bad news.

The bad news is the dashboard isn't designed to handle it and currently a bug prevents you from simply using that click event in that way you want to - it won't work right now, but I'll get a defect logged and it should be quite easy to fix.

The good news is that there's a bit of a workaround that can be used here.

We don’t really support this right now, partly because the dashboard page currently isn’t designed to handle it and partly because there is a bug in our code.


While it is possible to trigger the click event for the dashboards, it will only work if the dashboard is showing in the dashboard toolbar, because that element is on the page.


In this example I have a number of dashboards available in the More Dashboard Tabs dropdown. However, I can only trigger Sales Performance and Campaign Analysis to show via code because all of the other dashboards tab elements do not exist on the page

/6c8c41574988fd179cc43c0df3572df1


With that in mind, this code,

$(‘div.tab[uuid=”dashboard-uuid-here”]’).click();


Should work – however it doesn’t because the way that click event is handled by our code, is wrong and that prevents the above code from working. It works when the user clicks the link, because the browser sets up the click event slightly differently.


I’ve attached a dashboard which has a sketchy workaround to this bug, it is a dashboard with a single button, which when clicked triggers a click event on the tab of Campaign Analysis, which navigates to that dashboard. What is sketchy about it is it requires setting an id onto the clicked element, which is later removed.


But keep in mind it will only work if the dashboard you wish to navigate to is visible on the toolbar.


I'll also get an enhancement logged so navigating to a dashboard tab without reloading can be done with an API call.

I hope that helps!

Kind regards,

Chris

photo
1

Hi Chris,

This is really good, thank you....well it would be but there is an error in the xml file format preventing me from importing the yfx file.

Can you do the export again for me please...also, which version of YF are you exporting from?

photo
1

Actually don't worry, I was able to find the pertinent bit within the unzipped xml file...that works a f-ing treat mate! Thank the devs for me

photo
1

Hi Lex,

No worries. That's great to hear, I was about to ask what's up with the import on your end as it worked okay for me.

I'm glad that was able to solve your problem! :)

Kind regards,

Chris

photo
1

Hi Chris,

Sorry to re-open this but has there been any movement on the enhancement request. Using the provided spoof click event has reached it's limit rather quickly...eg, as soon as a dashboard goes into the "More Dashboard Tabs" section, it can't be navigated to with the $(‘div.tab[uuid=”dashboard-uuid-here”]’).click(); workaround.

It's a bit of a show stopper for us so if it can be pushed along at all, it would be much appreciated.

Cheers


Lex

photo
1

Ok..found a workaround, this actually weirdly works even though clicking on the $(‘div.tab[uuid=”dashboard-uuid-here”]’) doesn't....Still, it's a little bit messy, so if you can give them a squeeze about having a proper API call that would be great.


Workaround FYI:


$('.dashboardDropdown').click(); // This populates the yfDropMenuTitle elements in the DOM
$('.yfDropMenuTitle:contains("' + dashboard.shortdescription + '")').click(); // Annoyingly, can't be identified by UUID which makes it a bit bleugh (Dashboards can have the same name and users are...well, users)

photo
1

Hi Lex,

Thanks for posting that workaround. I've raised the priority with the developer team and made them aware, so hopefully we'll see something soon.

Kind regards,

Chris

photo