should not use DOM manipulation techniques

mdsannavulla
Kilo Guru

Hi All,

When we reviewed our code with ServiceNow they told we should not use DOM manipulation techniques in the script, which is a performance issue. But we are using these techniques for making fields read-only, for hiding UI macros and for some other scripts. Please see the below script which we are using for making variables read-only on RITM form and Catalog Task form (we got this from ServiceNow Guru).

1.png

function onLoad(){

    try{

   

      //Get the 'Variables' section

          var ve = $('variable_map').up('table');

          //Disable all elements within with a class of 'cat_item_option'

          ve.select('.cat_item_option', '.slushselectmtm', '.questionsetreference').each(function(elmt){

                elmt.disabled = true;

          });

          //Remove any reference or calendar icons

           

ve.select('img[src*=reference_list.gifx]','img[src*=delete_edit.gif]','img[src*=user_obj.gifx]','img[src*=view_edit.png]','img[src*=view_form.png]','img[src*=small_calendar.gifx]').each(function(img){

                img.hide();

   

          });

     

     

          //Hide list collector icons

          ve.select('img[src*=arrow]').each(function(img){

                img.up('table').hide();

          });

       

    }

    catch(e){}

}

Please provide any other alternatives to over come this.

5 REPLIES 5

mdsannavulla
Kilo Guru

And one more script we are using   for hiding "This item block" in order guides is


Here they are saying using document in client side is a performance issue.



function onLoad() {


      setTimeout(hideAdder, 100);  


}  


 


function hideAdder() {  


      if (document.getElementById('guide_tabs')) {//if item is an order guide  


              document.getElementById('adder').style.display = 'none';//hide this html element  


      }  


}  


We use DOM manipulation all the time! While it's true that it can affect performance, sometimes there's no other way (that I know of).


Can we right this code in server side ?


If we able to write this on server side then no performance issue will be there


Jim Coyne
Kilo Patron

I try to minimize to use of DOM manipulation as much as possible, but sometimes, like Geoff says, there's just no other way.   One prime example of that is moving the Update Set Picker back to the main frame's header, another fine ServiceNowGuru article (http://www.servicenowguru.com/system-ui/ui-scripts-system-ui/bringing-update-set-picker-ui14-gear-me...).   A lot of people dislike the fact the pickers were moved under the gear icon in Eureka (myself included) and this was the only way to get them back where they belong.



Now that being said, sometimes ServiceNow comes up with something new that we can leverage.   In your particular case, the ServiceNowGuru script can basically be replaced by new OOB functionality where Client Scripts and UI Policies can now run in the RITM and Catalog Task forms (started with Calgary).   These are the "Applies on a Catalog Item view", "Applies on Catalog Tasks" and "Applies on Requested Items" options on the forms now, although you may need to personalize the forms to add them.



It's fast and easy enough to enable those options for all your Catalog Client Scripts and UI Polices by using the multi edit feature of the list view (Editing Lists - ServiceNow Wiki), but depending on the number of catalog items you have, could take some time testing it works the way you need them to.