We've updated the ServiceNow Community Code of Conduct, adding guidelines around AI usage, professionalism, and content violations. Read more

How to add email icon in ui action button

viraj4
Giga Contributor

How to add email icon in UI action button??

1 ACCEPTED SOLUTION

Got it , below script works for me in my PDI

function onLoad() {

transformButton('email_incident', '#FF0000', 'white', 'icon-mail');

}

function transformButton (buttonID, buttonBackgroundColor, buttonTextColor, buttonIconName)  {
try{
//Find the button(s) by ID and change the background color
$$('button[id=' + buttonID + ']').each(function(elmt) {
elmt.style.backgroundColor = buttonBackgroundColor;
if(buttonTextColor){
elmt.style.color = buttonTextColor;
}
if(buttonIconName){
elmt.addClassName(buttonIconName);
//Add some spacing between the icon and button label
elmt.innerHTML = ' ' + elmt.innerHTML;
}
});
}catch(e){}
}

View solution in original post

23 REPLIES 23

Hi Omkar,

Please find the updated code -

------------------------------------------------------------------------------------------------------------

function onLoad() {

transformButton('3c0e15aadb2800d079327abe3b9639ae', '#FF0000', 'red', 'icon-mail');

}

function transformButton('3c0e15aadb2800d079327abe3b9639ae', '#FF0000', 'red', 'icon-mail') {
try{
//Find the button(s) by ID and change the background color
$$('button[id=' + buttonID + ']').each(function(elmt) {
elmt.style.backgroundColor = buttonBackgroundColor;
if(red){
elmt.style.color = red;
}
if(icon-mail){
elmt.addClassName(icon-mail);
//Add some spacing between the icon and button label
elmt.innerHTML = ' ' + elmt.innerHTML;
}
});
}catch(e){}
}

Thanks,

Viraj

Hi

 

Not the sys_id, the id of element which get after inspecting it the console by f12.

Hi

I checked twice and after inspecting i can find sys_id mentioned as the Id in the console.

Thanks

Viraj

Hi 

You dont need sys_id, check my code, approve there is the id of HTML Ui Action,as i have even attached the screentshot of the html id that i have referred to for the Ui Action.

Hi 

I updated the UI action name and got the ID as email_incident.

Still I face the issue on executing the below script.

function onLoad() {

transformButton('email_incident', '#FF0000', 'red', 'icon-mail');

}

function transformButton('email_incident', '#FF0000', 'red', 'icon-mail') {
try{
//Find the button(s) by ID and change the background color
$$('button[id=' + buttonID + ']').each(function(elmt) {
elmt.style.backgroundColor = buttonBackgroundColor;
if(red){
elmt.style.color = red;
}
if(icon-mail){
elmt.addClassName(icon-mail);
//Add some spacing between the icon and button label
elmt.innerHTML = ' ' + elmt.innerHTML;
}
});
}catch(e){}
}