Hi,

Recently I came across an issue related to Order Guide Attachments. One of our clients had a requirement that the items present in Service Catalog should have mandatory Attachments, but based on some conditions. The OOB checkbox 'Mandatory Attachment' did not help as the attachment needs to be mandatory if the user selects a particular choice option. As a result we were required to use a custom script that would execute on submit of the catalog form and prevent teh user from submitting if the attachment has not been attached.

I took the help from the following link to deal with the requirement. I created an UI Script which was included in the Service Portal JS Theme and called from the client script. This runs perfectly for the individual items. :

https://community.servicenow.com/community?id=community_article&sys_id=0f0c5290dbe7f380d82ffb2439961...

The main problem came when using Order Guides. In individual items, the widget uses the id 'sc_cat_item' for defining the catalog item element. As a result, angular.element("#sc_cat_item").scope() returns the scope of the catalog item and we can access the attachments from this particular scope. But in case of order guides, this element is not present. Since there are multiple items related to the order guide, each item id is defined in a unique id to distinguish between them.

I have made changes to the initial script which has helped me to work with this issue. Apparently, ServiceNow defines each item in an Order Guide display page with the item's sys_id in this format - #itemsysid. I have added a new Ui Script that would execute based on the item id for Order Guide. Here is the UI Script code:

function getSCAttachmentCountOrderGuide(itemSysID) {

    var length;
    try {
        var itemID = '#' + itemSysID;
        length = angular.element(itemID).scope().item.attachments.length;
    } catch (e) {
        length = -1;
    }
    return length;
}

In the client script, i have added a condition to check if the item is a part of Order Guide or displayed as an individual item. The OOB function g_service_catalog.isOrderGuide() checks if the item is a part of Order Guide or individual item. Here is the code for client script:

try {
            var orderGuide = gel('order_item_title').innerHTML;
            if(orderGuide != 'This Item')
            {
            var attachments = document.getElementById('header_attachment_list_label');
            if (attachments.style.visibility == 'hidden' || attachments.style.display == 'none') {
                alert("Please attach your Manager's approval before submitting the item.");
                return false;
            }
            }
        }
        //For Service Portal
        catch (e) {
            var isOrderGuide = g_service_catalog.isOrderGuide();
            if (isOrderGuide == true) {
                var count = getSCAttachmentCountOrderGuide(g_form.getUniqueValue());
                if (count <= 0) {
                g_form.addErrorMessage("Please attach your Manager's approval before submitting the item.");
                  return false;
               }
            } else {
                var count = getSCAttachmentCount();
                if (count <= 0) {
                    g_form.addErrorMessage("Please attach your Manager's approval before submitting the item.");
                    return false;
                }

            }
        }

The scope of the angular element allows a lot of scope for customizing. We can retrieve a plethora of information from the item scope related to a particular item.

Hope you will find this article helpful. Please let me know your valuable feedback regarding this solution.

If this article has helped you , then please bookmark it or mark it as helpful.
Thanks,
Avisek Dutta