Join the #BuildWithBuildAgent Challenge! Get recognized, earn exclusive swag, and inspire the ServiceNow Community with what you can build using Build Agent.  Join the Challenge.

How to add scrollbar for particular section in normal form

Le Son
Tera Contributor

I have 2 section on form 

I want add 2 scrollbar in each section.

Is there any way to do this?

This is my form

LeSon_0-1665648799652.png

 

 

2 ACCEPTED SOLUTIONS

Saurav11
Kilo Patron
Kilo Patron

Hello,

 

You need to write a onload client script on the form with the below code:-

 

var sec_el = document.getElementById("991f88d20a00064127420bc37824d385");//Sys ID of the section.

if(sec_el){

   sec_el.style.maxHeight = "100px"; //Update based on your need
   sec_el.style.overflow = "scroll";

}

 

Also make sure the isolate script checkbox is false on client script as it is DOM manipulation:-

 

Saurav11_0-1665648994196.png

 

For more info look at the below post:-

 

https://www.servicenow.com/community/service-management-forum/add-a-scroll-bar-for-particular-sectio...

 

Please mark my answer as correct based on Impact.

View solution in original post

For me it works perfectly fine:-

 

Saurav11_0-1665649861993.png

 

Btw I see you are using scoped application that means you cannot use document in scoped app

Saurav11_1-1665650141764.png

 

So to make it work do the below :-

 

Create a system property in that scope named :- glide.script.block.client.globals

 

Saurav11_2-1665650230887.png

 

This will make the document work in client script event.

 

For more info check the ServiceNow article:-

 

https://support.servicenow.com/kb?id=kb_article_view&sysparm_article=KB0551586

 

Please mark my answer as correct based on Impact.

View solution in original post

4 REPLIES 4

Saurav11
Kilo Patron
Kilo Patron

Hello,

 

You need to write a onload client script on the form with the below code:-

 

var sec_el = document.getElementById("991f88d20a00064127420bc37824d385");//Sys ID of the section.

if(sec_el){

   sec_el.style.maxHeight = "100px"; //Update based on your need
   sec_el.style.overflow = "scroll";

}

 

Also make sure the isolate script checkbox is false on client script as it is DOM manipulation:-

 

Saurav11_0-1665648994196.png

 

For more info look at the below post:-

 

https://www.servicenow.com/community/service-management-forum/add-a-scroll-bar-for-particular-sectio...

 

Please mark my answer as correct based on Impact.

Le Son
Tera Contributor

Yes i tried write a onload on form but it doesn't work. It message error (TypeError: Cannot read properties of null (reading 'getElementById')).

It only works on incident table

I think this only works on global

My section form have sys_id is ccb9ec4997621110ed287f5e6253af20.

LeSon_0-1665649455622.png

LeSon_1-1665649532174.png

 

 

For me it works perfectly fine:-

 

Saurav11_0-1665649861993.png

 

Btw I see you are using scoped application that means you cannot use document in scoped app

Saurav11_1-1665650141764.png

 

So to make it work do the below :-

 

Create a system property in that scope named :- glide.script.block.client.globals

 

Saurav11_2-1665650230887.png

 

This will make the document work in client script event.

 

For more info check the ServiceNow article:-

 

https://support.servicenow.com/kb?id=kb_article_view&sysparm_article=KB0551586

 

Please mark my answer as correct based on Impact.

Le Son
Tera Contributor

I tried create system properties. But it doesn't works

Is there any way to do this?

LeSon_0-1665651054269.png