top of page

Add i-Button in Dashboard

Currently there is an option to add description for each widget by click on i-button on title. But there is no i-button at dashboard level to write some information such as purpose and other details about dashboard. Here is a script to add i-Button in dashboard toolbar.

When you click on this i-Button, description will be displayed on a pop-up window.


Steps:

  1. Create Dashboard

  2. Add below script to dashboard. Update the variable 'template' with description of dashboard.

  3. Save the script and refresh dashboard



dashboard.on('initialized', function (se, ev) {
	
	let clearFiltersButton = 
		`<button id="dashboard-i-button" class="btn btn--transp" title="Description" style="width: 24px; height:24px">
		 <svg class="app-icon__svg">
          <use xlink:href="#general-info-circle"></use>
           </svg>
		 </button>`
	
	let $toolbarRight = $('.prism-toolbar__section--right .prism-toolbar__cell.btns-holder');
	$toolbarRight.prepend(clearFiltersButton);

	$toolbarRight.find('#dashboard-i-button').on('click', dashboardDescription);
})

function dashboardDescription() {
	const modalScope = prism.$ngscope;
	const modalDom = prism.$injector.get('ux-controls.services.$dom');
	
	const options = {
		scope: {
			in: modalScope,
		},
		template: `Welcome to Sales Dashboard<br>
				(Description about the dashboard...)`,
	};
	
	const ui = {};

	modalDom.modal(options, ui);
	if (!modalScope.$$phase) {
		modalScope.$apply();
	}
	
	$('.md-ai-modal').css({'z-index':'999', 'position':'absolute', 'left': '0', 'right': '0', 'top':'30%'})
	$('.md-content').css({'z-index':'999', 'position':'absolute', 'left': '0', 'right': '0', 'top':'30%', 'width':'500px'})
	$('.md-overlay').css({'z-index':'998', 'position':'absolute'})
	
}


148 views0 comments

Comments

Rated 0 out of 5 stars.
No ratings yet

Add a rating
BI Next Level white logo

BI Next Level is your trusted resource for BI customization, data solutions, and expert insights. Explore practical tips, scripts, and tutorials for tools like Sisense, Python, and SQL. Let’s transform your data into impactful insights together.

Quick Links
Connect with us
Copyright © 2024. All Rights Reserved. Designed, Developed & Maintained  by Intertoons
bottom of page