Modify login widget of the header portal

J_L
Kilo Explorer

Hello,
My objective is to add a "password reset" link in this pop-up
find_real_file.png
it comes from the CSM or CSP portal (it same fonction) when you click on login when you are disconnected from the portal
find_real_file.png

for CSM, the name of header is "CSM Stock Header"
the line for this login link is : 
 <li><a href ng-click="openLogin()">${Login}</a></li>
find_real_file.png
The client controller code is: 
$scope.openLogin = function () {
$scope.modalInstance = $uibModal.open({
templateUrl: 'csm_stock_header_template',
scope: $scope
});
};
I don't know where to find the "templateUrl" (it not a widget)
Does anyone know how to access and modify this pop-up login? 

NB: I don't want to create a redirection to a login page for security reasons, I need a pop-up, I tried to create a new pop-up to replace it but I had connection problems.

Thank you for your help.

1 ACCEPTED SOLUTION

Josh Virelli
Tera Guru

Hi Lahnin,

That template is an Angular ng-template associated with the widget record, see here:

find_real_file.png

My recommendation would be to leave that template as is, but clone the widget and then do an Insert and Stay on that Angular ng-template (rename it of course), and then change the Client Controller script to use the name of the new template, for example:

templateUrl: 'pwd_reset_csm_stock_header_template',

if you'd like to know more about the UI Bootstrap modal in ServiceNow, I'd recommend Nathan Firth's post on it here: Modal Windows in Service Portal

Let me know if you need more help. You could also simply add a new link to the nav-bar for Password Reset instead of editing this modal window.

If my answer helped you, or is correct, please mark it as 'Helpful' or 'Correct'

Thanks,

Josh

View solution in original post

2 REPLIES 2

Josh Virelli
Tera Guru

Hi Lahnin,

That template is an Angular ng-template associated with the widget record, see here:

find_real_file.png

My recommendation would be to leave that template as is, but clone the widget and then do an Insert and Stay on that Angular ng-template (rename it of course), and then change the Client Controller script to use the name of the new template, for example:

templateUrl: 'pwd_reset_csm_stock_header_template',

if you'd like to know more about the UI Bootstrap modal in ServiceNow, I'd recommend Nathan Firth's post on it here: Modal Windows in Service Portal

Let me know if you need more help. You could also simply add a new link to the nav-bar for Password Reset instead of editing this modal window.

If my answer helped you, or is correct, please mark it as 'Helpful' or 'Correct'

Thanks,

Josh

Thank you Josh Virelli for your answer,

I had no association in my Angular ng-template that's why I couldn't find the template, for other people who have the same problem here's the solution I did:

'csm_stock_header_template' Is Angular ng-templates we can access to this record :

find_real_file.png
Or

To find angular template: 

  • sp_ng_template.list

in this template we can see this line:

<sp-widget widget="data.loginWidget"></sp-widget>

 

The loginwidget is data from server script (find it in the header):

data.loginWidget = $sp.getWidgetFromInstance('login-modal-customerservice');

 

'login-modal-customerservice' is instance to find it :

  • Service portal -> Widget instances

Filter by ID:

find_real_file.png

you should be clone the widget if you want to change it and you can find the widget here :

find_real_file.png

you can associate this approach with Josh Virelli's solution to make a cleaner change by creating a new instance and changing the client code to put the new url of the instance.