Hi Admin Community,
I'm not an expert in Angular JS nor even JS, but I have a long background of learning on the fly and adapting to anything that comes my way as an IT professional. My post here is both one of a question about my configuration as well as I'm open to adjusting my approach.
I'm trying to achieve displaying the SC task information into the standard ticket tab by using the custom tab type as mentioned here - https://docs.servicenow.com/bundle/rome-servicenow-platform/page/build/service-portal/task/configure-st-page.html. See below.
Here is a snippet of the HTML that is showing this (which is also part of the widget I mention below):
iv>
<div role="row" class="list-group-item table-responsive" ng-repeat="item in c.data.request.req_list" style="margin:0px" >
<div role="cell" class="col-xs-2 padder-l-none padder-r-none main-column">
<div class="primary-display">
<a href="?id={{::item.url.id}}&table={{::item.url.table}}&sys_id={{::item.url.sys_id}}" sn-focus="{{::item.highlight}}"> {{::item.display_field}} </a>
</div>
<small class="text-muted">
<div ng-repeat="f in item.secondary_displays" class="secondary-display">
<span >{{::f.display_value}}</span>
</div>
</small>
</div>
<div role="cell" class="col-xs-4 padder-l-none padder-r-none shortdescription-column">
<div class="state">
<span>{{::item.shortdescription}}</span>
</div>
</div>
<div role="cell" class="col-xs-2 padder-l-none padder-r-none state-column">
<div class="state">
<span>{{::item.state}}</span>
</div>
</div>
<div role="cell" class="col-xs-2 padder-l-none padder-r-none created-column">
<div class="created">
<i class="fa fa-clock-o" aria-hidden="true" title="${Created}"></i>
<sn-time-ago timestamp="::item.created"/>
</div>
</div>
<div role="cell" class="col-xs-2 padder-l-none padder-r-none updated-column">
<div class="updated">
<i class="fa fa-clock-o" aria-hidden="true" title="${Updated}"></i>
<sn-time-ago timestamp="::item.updated_on"/>
</div>
</div>The widget that I'm embedding in the tab area is the My Request widget. I like the use of it since it gives me the ability to adjust the information presented using both scripting (if desired) as well as the Standard Ticket Configuration on the backend. So, it's very versatile for me at the moment while I continue to learn JS and AngularJS as one of the admins of this tool. The widget screenshot as well is just a dump (with a display limiter on it) of all SC task information related to myself (ie My Requests).
I know that you cannot call the parent.sys_id of the SC task here just by using the current instance of the serverside scripting since the code is isolated in the widget itself. However, I do know that you can use a scope call to bring in the current sys_id of the RITM and hold that as a variable. What I don't know is below, and I'm hoping someone can either help me or guide me in the right direction here.
- Do I control the while loop of gr.next() with a condition (scoped sys_id) on the Serverside script of the widget?
- Do I control the NG-Repeat of the HTML with a condition (scoped sys_id or anything else) on the Angular side of the HTML portion of the widget?
- Should I take another direction with a condition to display this information?
Again, I'm open to feedback on this and want to understand what is correct in my assumption and what clearly is not.
Hi Adam,
I have created a widget where it displays all the associated SCTASKS. I have added that widget in one of the page and it is working as expected.
But when I added this widget to ticket tab configuration it is showing as empty
Code of Widget:
HTML:
<div class="container">
<div class="row">
<div class="col"><strong>Task Number</strong></div>
<div class="col"><strong>Short Description</strong></div>
<div class="col"><strong>State</strong></div>
<div class="col"><strong>Assigned To</strong></div>
<!-- Add more field names here -->
</div>
<div class="row" ng-repeat="task in data.catalogTasks">
<div class="col">{{ task.number }}</div>
<div class="col">{{ task.short_description }}</div>
<div class="col">{{ task.state }}</div>
<div class="col">{{ task.assigned_to }}</div>
<!-- Add more field values here -->
</div>
</div>
CSS:
<style>
.container {
display: flex;
flex-direction: column;
border: 1px solid #ccc;
padding: 10px;
}
.row {
display: flex;
flex-direction: row;
justify-content: space-between;
border-bottom: 1px solid #ccc;
padding: 5px;
}
.col {
flex-basis: 20%;
padding: 5px;
}
.col:first-child {
flex-basis: 10%;
}
</style>
Server Script:
@Adam Wencel Can you please give me some suggestion that how can I show those details in Tab Configuration.
Thanks in advance,
Akhil.
Another item that I didn't focus on was the calling of the widget instance in the Standard Ticket Tab instead of using the custom placeholder as seen below.
var tabs = [];
var config = sn_std_tkt_api.TicketConfig.getConfig(data.table, record.sys_domain);
var isNonPrimary = ((record.isValidField('universal_request') && !record.universal_request.nil()) && (record.universal_request.primary_task != record.sys_id));
if (!config.tabs) {
var tab_1 = {
name: gs.getMessage('Activity'),
order: 0,
widget: $sp.getWidget('std_ticket_conversations',
{sys_id: data.sys_id,
table:data.table,
btnLabel: gs.getMessage('Post'),
read_only: isNonPrimary || urClosedState,
rich_text_editor: options.rich_text_editor,
at_mentions: options.at_mentions
})
};
tabs.push(tab_1);
var tab_2 = {
name: gs.getMessage('Attachments'),
order: 1,
widget: $sp.getWidget('std_ticket_attachments', {record_id: data.sys_id,
record_table: data.table,
read_only: isNonPrimary || urClosedState
})
};
tabs.push(tab_2);
}I don't know if that's the solution in addition to the ones I've mentioned above. I assume since the tab types are very specific that you cannot call the 'my_requests' via $sp.getWidget since it's predefined.
