Forum Discussion

Astroraf's avatar
Astroraf
Data Pipeline
07-02-2024
Solved

Creating a hyperlink in widget title; having it show in editing and viewer mode

I am using this script to create a hyperlink in a widget title but the hyperlink only shows in editing mode and not in the viewer mode. Trying to see what I can do to have this show in viewer mode as well. 

widget.on('refreshed', () => {

                const titleElement = element.parent().find('.transput-holder');                            if (!titleElement) return;                                                                titleElement.empty(); 
                titleElement.append('<a href="https://website.com" target="_blank" >MSI Info</a>'); 
                if (!widget.dashboard.editing) {
                titleElement.parent().show(); } 
})

 This is what I see in editing mode and viewer mode:

DRay harikm007 

 

Code-first Analytics
Dashboards & Reporting
  • TriAnthony's avatar
    TriAnthony
    07-02-2024

    Hi Astroraf,

    In Viewer mode, the element for the widget title is widget-title, under the div class widget-title__holder. You can find below the updated the script to add the hyperlink in Viewer mode as well as Edit mode.

    Note that I removed the if(!titleElement) return; line, because even if a title is not provided for the widget, these elements still exist. Moreover, even if the elements don't exist, this check will still return an object (empty, but is not null/falsy). To check if an element exists, you can do use this instead: if(titleElement.length === 0)

     

    widget.on('ready', () => {

	const titleElementEditMode = element.parent().find('.transput-holder');
	const titleElementViewMode = element.parent().find('.widget-title__holder > widget-title');
	
	titleElementEditMode.empty();
	titleElementViewMode.empty();

	titleElementEditMode.append('<a href="https://website.com" target="_blank" >MSI Info</a>'); 
	titleElementViewMode.append('<a href="https://website.com" target="_blank" >MSI Info</a>'); 

})

     

1 Reply

  • TriAnthony's avatar
    TriAnthony
    Admin
    07-02-2024

    Hi Astroraf,

    In Viewer mode, the element for the widget title is widget-title, under the div class widget-title__holder. You can find below the updated the script to add the hyperlink in Viewer mode as well as Edit mode.

    Note that I removed the if(!titleElement) return; line, because even if a title is not provided for the widget, these elements still exist. Moreover, even if the elements don't exist, this check will still return an object (empty, but is not null/falsy). To check if an element exists, you can do use this instead: if(titleElement.length === 0)

     

    widget.on('ready', () => {

	const titleElementEditMode = element.parent().find('.transput-holder');
	const titleElementViewMode = element.parent().find('.widget-title__holder > widget-title');
	
	titleElementEditMode.empty();
	titleElementViewMode.empty();

	titleElementEditMode.append('<a href="https://website.com" target="_blank" >MSI Info</a>'); 
	titleElementViewMode.append('<a href="https://website.com" target="_blank" >MSI Info</a>'); 

})