Can I use a modal dialog (pop up window) in employee center?

Julian Reis
Tera Contributor

‎04-01-2025 11:02 AM

 

Hi guys, i ve been working on the employee center and i have a problem with my page. I am working with the Data Table widget (clone), which helps me to show the assets that are assigned to me. 

 

JulianReis_0-1743530117766.png

When I click on a record, a new page in employee center opens and i can see the record. 

JulianReis_1-1743530178235.png

I implemented this in client controller part of my Data Table Widget Clone. Without line 37 the record would not be open.

JulianReis_2-1743530315609.png

 

Now my question is, if it is possible to use a modal for opening the asset record like a pop up window. I dont like it that when i click on a record in the table, a new employee center page opens. Is this possible?

 

Thank you 🙂

 

 

0 Helpfuls
  • 421 Views
2 REPLIES 2

Pooja_Patil
ServiceNow Employee
ServiceNow Employee

‎04-01-2025 11:19 AM

@Julian Reis you have two options in service portal $uibModal & spModal

You can inject either in your controller, here are some examples - 

api.controller = function ($uibModal, spModal) {
	$scope.modalInstance = $uibModal.open({
		templateUrl: '<teplate_to_load>',
        scope: $scope
	});

	spModal.open({
		title: '',
        size: 'lg',
		widget: '<widget_to_load>',
		widgetInput: '<widget_input>',
		buttons: [{
			label: '${Close}',
			primary: true
		}]
	});

	spModal.open({
		//appendTo: el,
		title: '<modal_title>',
		message: message,
		footerStyle: {border: 'none' },
		buttons: [
			{label: '${No}', cancel: true },
			{label: '${Yes}', primary: true },
		]
	}).then(
		function(e) {
			console.log('yes');
		},
		function(e) {
			console.log('no');
		}
	);
}
 You can see some existing implementation in OOB widgets.
 

Please mark this as Helpful / Accept the Solution if this helps.

0 Helpfuls

Shivalika
Mega Sage

‎04-01-2025 11:28 AM

Hello @Julian Reis 

 

Did you try adding glideModal in client script ? 

 

function openAssetModal(assetSysId) {

    var modal = new GlideModal('asset_view_modal');

    modal.setTitle('Asset Details');

    modal.setSize('large'); // Options: small, medium, large

    modal.setBody('<iframe src="/now/nav/ui/classic/params/target/alm_asset.do?sys_id=' + assetSysId + '" width="100%" height="500px" style="border:none;"></iframe>', false, false);

    modal.render();

}

 

Kindly mark my answer as helpful and accept solution if it helped you in anyway. This will help me be recognized for the efforts and also move this questions from unsolved to solved bucket. 

 

Regards,

 

Shivalika 

 

My LinkedIn - https://www.linkedin.com/in/shivalika-gupta-540346194

 

My youtube - https://youtube.com/playlist?list=PLsHuNzTdkE5Cn4PyS7HdV0Vg8JsfdgQlA&si=0WynLcOwNeEISQCY

 

0 Helpfuls