Redirect to Dashboard by embedding Dashboard URL inside LWC

Question

I have a custom Dashboard and a custom LWC and an Account record Page as shown below.

https://i.sstatic.net/8JFeR.png

On Dashboard tab, I have embedded the custom LWC and inside which I have added Dashboard URL as an Iframe but it's not redirecting correctly to the dashboard when clicked on Dashboard tab.

Below is my LWC code

export default class DynamicDashboard extends NavigationMixin(LightningElement) {

  @track iframeURL;
  @track a_Record_URL;
        
  connectedCallback(){
    this.a_Record_URL = window.location.origin;
  }

  @wire(getRecord, {
    recordId: "$recordId",
    fields
  })
  loadFields({error, data}){
    if(data){                                
      this.iframeURL = 'this.a_Record_URL/desktopDashboards/dashboardApp.app?dashboardId=01Z4y000001O93MEAS&displayMode=view&networkId=000000000000000';
    }
  }
}

this.iframeURL is not populating correctly I believe due to which When I click on Dashboard tab on Account record page it says 'URL is invalid. Please try with correct URL'.

Please help me out on this. I have tried most of the possible alternatives but it's not working.

Please help me out team.

Thanking you in anticipation.

kkJhn · Accepted Answer · 2022-11-22 15:55:17Z

0

Don't include the base domain if you want to show only dashboard in a custom component. check out this one.

HTML

<iframe
src={iframeURL}
height={height}
width={width}
id="ifram-1"
frameborder="0"
></iframe>

JS

@track height = '870px';
@track iframeURL= '';
@track width = '100%';

 @wire(getRecord, {
    recordId: "$recordId",
    fields
})
loadFields({error, data}){
  if(data){                                
this.iframeURL = '/desktopDashboards/dashboardApp.app? 
dashboardId=01Z4y000001O93MEAS&displayMode=view&networkId=000000000000000';    
}

answered Nov 22, 2022 at 15:55

kkJhn

131 bronze badge

Sign up to request clarification or add additional context in comments.

2 Comments

Bartheleway Over a year ago

You're missing the point. Concatenation is wrongly done "this.iframeURL = this.a_Record_URL + '/......"

kkJhn Over a year ago

You're right, that might be the issue.

Bartheleway · Accepted Answer · 2022-11-28 11:35:02Z

After formatting the code, it appears pretty obvious there is an issue with concatenation. Please try to always format correctly your code, this help avoid a lot of errors.

Concatenation between variable and static string can be achieve in several ways:

// Basic using + operator
this.iframeURL = this.a_Record_URL + '/desktopDashboards/dashboardApp.app?dashboardId=01Z4y000001O93MEAS&displayMode=view&networkId=000000000000000';

// Using backtick
this.iframeURL = `${this.a_Record_URL}/desktopDashboards/dashboardApp.app?dashboardId=01Z4y000001O93MEAS&displayMode=view&networkId=000000000000000`;

// Using array
this.iframeURL = [
  this.a_Record_URL,
  '/desktopDashboards/dashboardApp.app?dashboardId=01Z4y000001O93MEAS&displayMode=view&networkId=000000000000000'
].join('')

Collectives™ on Stack Overflow

Redirect to Dashboard by embedding Dashboard URL inside LWC

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related