How to hide HTML strong text using catalog client script???

[mallikarjunared]

Hi All,

I am unable to hide HTML text using catalog client script.   I want only Order Now button in the form.

I wrote catalog client script and able to hide everything, but not Order this Item text which doesn't have Id in view source(HTML).

function onLoad()

{

  sc_delivery_time_label_cell.hide();

  sc_delivery_time_cell.hide();

  sc_cart_item_list.hide();

  price_subtotal_span.hide();

  price_subtotal_label_span.hide();

  price_label_span.hide();

  price_span.hide();

  quantity_label_span.hide();

  quantity.hide();

  oi_add_to_cart_button.hide();

}

Someone Plz let me know how to hide this Order this Item text in the form using catalog client script???

[bernyalvarado]

Hi, do you really want to do this? In order to do it you will need to touch very core functionality which I believe has been changing through ServiceNow versions... and most probably will continue to change (internally).

In Fuji at least, it's managed within the UI macro: catalog_cart_v2. In that UI macro line 11 contains the content of that table you're referring to and is a package to which i don't think there's access to modify: com.glideapp.servicecatalog_cart

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

       <!-- Invoke a template that writes catalog and view to page -->

       <g:inline template="sc_catalog_view.xml" />

       <input type="hidden" id="cart_v2" value="${gs.getProperty('glide.sc.use_cart_layouts', 'true')}" />

       <j:if test="${sysparm_cartless == 'true'}">

               <j:set var="jvar_cart_style" value="display: none;"/>

       </j:if>

       <div id="sc_cart_contents" style="margin: 5px; ${jvar_cart_style}">

               <table id="qty" class="sc_cart_window" style="min-width: 200px; max-width: 200px; margin: 0px; margin-bottom: 2px; ${jvar_cart_style}" border="0">

                       <g:com.glideapp.servicecatalog_cart target="order_item" prices="false" />

               </table>

               <table id="sc_cart_item_list" class="sc_cart_window" style="min-width: 200px; max-width: 200px; margin: 0px; margin-bottom: 2px; display: none;" border="0">

                       <g:com.glideapp.servicecatalog_cart target="shopping_cart" prices="true" />

               </table>

       </div>

</j:jelly>

The option will then be to create a UI Script that through a gel('your_element_id') or $('your_element_id') you then can set its display property to none. You also have the option of doing this through JQuery which makes it a little bit more straight forward to hide the elements you're referring since as probably have already noticed, elements like the text: Order this item is just text. Either way, these statements will need to go within a function in a UI Script the one could be invoked from this UI Macro.

I hope this is helpful!

Thanks,

Berny

[bernyalvarado]

Hi Mallikarjuna, I just figured out another way you could do this which is by executing the following script:

window[2].gel('qty').firstElementChild.childNodes[0].style.display = 'none';

Thanks,

Berny

[mallikarjunared]

Hi Berny,

Thanks for your response.

I wrote the following catalog client script for hiding Order this Item text. But it is not working for the items which doesn't have id. I got the id through view source. Not sure exactly how to hide text which is used in between HTML <Strong> tag. Below is the output when I am executing the below code.

function onLoad()

{

  sc_delivery_time_label_cell.hide();

  sc_delivery_time_cell.hide();

  sc_cart_item_list.hide();

  price_subtotal_span.hide();

  price_subtotal_label_span.hide();

  price_label_span.hide();

  price_span.hide();

  quantity_label_span.hide();

  quantity.hide();

  oi_add_to_cart_button.hide();

  window[2].gel('Order this Item').firstElementChild.childNodes[0].style.display = 'none';

}

Any pointers is highly helpful

[bernyalvarado · Accepted solution]

Hi Mallikarjuna,

A couple of observations:

a) you may want to remove the .hide() lines since these could be causing errors and so then stopping the execution of the script

b) try adding the script in an onChange catalog client script. I tried it in Fuji and it works (it removes the Order This Item label)

function onChange(control, oldValue, newValue, isLoading) {

     gel('qty').firstElementChild.childNodes[0].style.display = 'none';





     //Type appropriate comment here, and begin script below



}

Thanks,

Berny