top of page

Modal popup in Dashboard

Sometimes you may need to show some messages, like information about the charts, on loading the dashboard. This can be achieved using below script.


Steps:

  1. Create a dasboard

  2. Add below script to dashboard. Update the template with messages you need to display on modal. Also possible to specify an HTML url instead of text message if you change 'template' to 'templateUrl'.

  3. save the script and refresh dashboard


dashboard.on('initialized', function (se, ev) {
	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'})
	
})

345 views0 comments

留言

評等為 0(最高為 5 顆星)。
暫無評等

新增評等
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