How to add a table for catalog item -Service portal-Servicenow

[sana13]

I have this catalog page

I am trying to add incident table for create Incident catalog,So I did it using Data table from instance widget provided by OOB.

Table added successfully no issues in that. But that table display in all catalog pages

I want to display it only for Create Incident What I did wrong?Any help?Thanks!!.

[Josh Virelli · Accepted solution]

Hi Sana,

Unless you want to make a custom page for the Create Incident record producer, you can also use angular to show/hide that table based off of the sys_id of the record producer that's in the url. There may be other ways to do this, but this is what I would do:

1. Clone the Data Table from Instance widget.
2. In the server script, make a true/false in your data object. We'll call it data.showWidget. Copy below into your server script and make sure you replace 'sysidofyourreccordproducer' with the Sys ID of the Create Incident Record Producer 🙂

3. (function(){
   	/*  "use strict"; - linter issues */
   	// populate the 'data' object
   
   //This is where we will determine whether to show or hide the table widget
   data.showWidget = false;
   var sysIdParm = $sp.getParameter('sys_id');
   if(sysIdParm == 'sysidofyourrecordproducer'){
   data.showWidget = true;
   }
   
   	var sp_page = $sp.getValue('sp_page');
   	var pageGR = new GlideRecord('sp_page');
   	pageGR.get(sp_page);
   	data.page_id = pageGR.id.getDisplayValue();
   	$sp.getValues(data);
   	if (data.field_list) {
   		data.fields_array = data.field_list.split(',');
   	} else {
   		data.field_list = $sp.getListColumns(data.table);
   	}
   
   	if (input) {
   		data.p = input.p;
   		data.o = input.o;
   		data.d = input.d;
   		data.q = input.q;
   	}
   	data.p = data.p || 1;
   	data.o = data.o || $sp.getValue('order_by');
   	data.d = data.d || $sp.getValue('order_direction');
   
   	data.page_index = (data.p - 1);
   	data.window_size = $sp.getValue('maximum_entries') || 10;
   	data.window_start  = (data.page_index * data.window_size);
   	data.window_end = (((data.page_index + 1) * data.window_size));
   	data.filter = $sp.getValue("filter");
   
   	var gr = new GlideRecordSecure(data.table);
   	if (!gr.isValid()) {
   		data.invalid_table = true;
   		data.table_label = data.table;
   		return;
   	}
   	data.table_label = gr.getLabel();
   
   	var widgetParams = {
   		table: data.table,
   		fields: data.field_list,
   		o: data.o,
   		d: data.d,
   		filter: data.filter,
   		window_size: data.window_size,
   		view: 'sp',
   		title: options.title,
   		show_breadcrumbs: true
   	};
   	data.dataTableWidget = $sp.getWidget('widget-data-table', widgetParams);
   })();

4. And then in the HTML, add the ng-if condition with that data object variable to the top level div. Copy this into your HTML:

5. <div ng-if="data.showWidget">
     <div class="alert alert-danger" ng-if="data.invalid_table">
       ${Table not defined} '{{data.table_label}}'
     </div>
     <sp-widget ng-if="data.dataTableWidget" widget="data.dataTableWidget"></sp-widget>
   </div>

6. Should be good to go. Just tested and working in Jakarta.