Display subcategories as clickable items

[mathiasjohansso]

Hi all!

I have a requirement from a customer to show subcategories as items in the "SC Category Page"-widget.

OOB, when a category does not have any orderable items, the page will only state that there are no items in the category, even if there are subcategories.

Is it possible to modify the widget and enable you to browse the categories?

[kotiswaroop · Accepted solution]

Hi Mathias,

You can clone the widget and modify the script as you like.

In the OOB page with id as 'sc_category' observe the url when you are clicking on a category. SC Category Page widget   will take the sysid of the category from url and will glide record sc_cat_item_category table to display the items related to it. Now what you need to do is instead of querying sc_cat_item_category table query sc_category table based on sysid from the url and use the all the oob code to collect subcategory info and displaying. At the same time modify the directive code as well in SC Categories widget. This is the widget which changes the url of the page [shows category navigation]. So you need to take care of the directive present in this.

Regards

Swaroop

[mathiasjohansso]

It worked! A lot easier than I thought!

Thank you very much for your help

[mirkoe]

This would be a huge improvement for me too. Is it possible to share your modifications Mathias?

[mathiasjohansso]

Add this to your server script on the SC Categories Page widget (you need to clone it first) after the "sc.query();" (on row 26 OOB)

var subCat = new GlideRecord('sc_category');
subCat.addQuery('parent', data.category_id);
subCat.orderBy('title');
subCat.query();
while (subCat.next()){
   // Does user have permission to see this item?
   if (!$sp.canReadRecord("sc_category", subCat.sys_id.getDisplayValue()))
       continue;

   var subItem = {};
   subCat = GlideScriptRecordUtil.get(subCat).getRealRecord();
   subItem.name = subCat.title.getDisplayValue();
   subItem.short_description = subCat.description.getDisplayValue();
   subItem.picture = ''; // set a default picture here 
   if (subCat.homepage_image){
       subItem.picture = subCat.homepage_image.getDisplayValue();
   }
   subItem.sys_id = subCat.sys_id.getDisplayValue();
   subItem.sys_class_name = subCat.sys_class_name + "";
   subItem.page = 'sc_category';
   items.push(subItem);
}