Want to make checkbox label color in red

Burhan2
Tera Contributor

Hi Team,

I want to make few checkboxes label in red color in my catalog item in portal...I tried g_form.getControl method in client script but its not working does anybody have any idea how to do that please help me? Thanks

1 ACCEPTED SOLUTION

Ankur Bawiskar
Tera Patron
Tera Patron

@Burhan2 

g_form.getControl() won't work in portal.

check this link where I shared solution few years ago and it works in both native + portal

How to make text of Label type in Bold 

Sharing sample script from same here again

You can use this catalog client script onLoad and make the Label variable as Bold

Script: This will work in both native + portal

1) Ensure Isolate Script field is set to false for this client script

2) This field is not on form but from list you can make it false

function onLoad(){

	setTimeout(function(){ 
		
		if(window != null){
			// native
			g_form.getControl('variableName').setAttribute('style', 'font-weight: bold;color:blue');
		}
		else{
			// portal
			var aTags = this.document.getElementsByClassName("ng-binding");
			var searchText = "My Label"; // give the label name here
			var found;

			for (var i = 0; i < aTags.length; i++) {
				if (aTags[i].textContent.toString() == searchText) {
					aTags[i].style.fontWeight = 'bold';
					break;
				}
			}
		}

	}, 3000);

}

AnkurBawiskar_0-1735302411535.png

 

Output:

Native:

AnkurBawiskar_1-1735302411536.png

 

Portal:

AnkurBawiskar_2-1735302411532.png

 

 

If my response helped please mark it correct and close the thread so that it benefits future readers.

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

View solution in original post

10 REPLIES 10

@Burhan2 

did you give correct variable name?

please share your script, client script screenshots and screenshot for variable configuration

Any browser console error when it runs in RITM view?

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

function onLoad(){

    setTimeout(function(){
       
        if(window != null){
            // native
            g_form.getControl('cb113').setAttribute('style', 'font-weight: bold;color:red');
        }
        else{
            // portal
            var aTags = this.document.getElementsByClassName("ng-binding");
            var searchText = "Workday"; // give the label name here
            var found;

            for (var i = 0; i < aTags.length; i++) {
                if (aTags[i].textContent.toString() == searchText) {
                    aTags[i].style.fontWeight = 'bold';
                    aTags[i].style.color = 'red';
                    break;
                }
            }
        }

    }, 3000);

}
 
 
this is the script no there is no browser error on native side its just showing that variable checkboattchment.pngx as usual in black color

@Burhan2 

so Workday should be in bold and red?

it's a checkbox type then the script I shared for native won't work, it will change the label as bold and red and not the checkbox value

use this and it will work for native

$j("label:contains('Workday')").css('color','red');

$j("label:contains('Workday')").css('font-weight','bold');

If my response helped please mark it correct and close the thread so that it benefits future readers.

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

Showing this in client script as wellattchment1.png

@Burhan2 

when you make Isolate Script Field = False then the above should work fine

that's just a info message for DOM

you are in global scope or scoped app?

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader