@Kishor O - Explanation is within the code comments
Widget build:
HTML Template
<div>
<!-- anchor tag styled as button using ng-href to assign link -->
<a ng-href="{{c.redirect}}" class="btn btn-default col-xs-12 col-sm-12 col-md-12 m-b-lg">Create an Incident</a>
</div>
Server Script
(function() {
//if client sends a get request use the details to get the title
if(input && input.action == 'GET ARTICLE TITLE'){
var kaGr = new GlideRecord('kb_knowledge');
if(input.is_article_number){
if(kaGr.get('number', input.ka_id))
data.title = kaGr.short_description.toString();
}else{
if(kaGr.get(input.ka_id))
data.title = kaGr.short_description.toString();
}
}
})();
Client controller
api.controller = function($scope, $location) {
var c = this;
//use $location to grab parameters to place on redirect url
var urlParams = $location.search();
// get the value of sysparm_article or sys_id
var ka_id = urlParams.sysparm_article || urlParams.sys_id;
//check which param exists
var isArticleNumber = urlParams.hasOwnProperty('sysparm_article') ? 'number' : 'sys_id';
c.redirect = "";
if (ka_id) {
c.server.get({
"action": "GET ARTICLE TITLE",
"ka_id": ka_id,
"is_article_number": isArticleNumber
}).then(function(resp) {
c.title = resp.data.title;
//build url that points to the catalog item page including params with KA details
//start with question mark in case the page this widget is rendered in different portals
//?id=sc_cat_item&sys_id=SYS_ID_TO_YOUR_RECORD_PRODUCER_HERE&ka_title=TITLE OF ARTICLE HERE
c.redirect = "?id=sc_cat_item&sys_id=3f1dd0320a0a0b99000a53f7604a2ef9&ka_title=" + c.title;
})
}
);
Catalog Client Script (UI Type set to All or Mobile/Service Portal
function onLoad() {
//get the url params
try{
var urlParams = decodeURIComponent(location.search);
}catch(err){
console.error("err", err)
}
//unlike working with AngularJS we need to work for getting each param
//split the url string into an array by "&"
var urlArr = urlParams.split("&")
//array should look something like this ['?id=sc_cat_item','sys_id=SYS_ID_TO_YOUR_RECORD_PRODUCER_HERE','ka_title=TITLE OF ARTICLE HERE']
//now we filter it down to just get the ka_title parameter and value and assign to the short_descrition variable
g_form.setValue('short_description', urlArr.reduce(filterForTitle, ""))
//callback function for reduce array method
function filterForTitle(str, param) {
//split each iteration by =
var paramValueArray = param.split("=");
//assign str if param is the same as ka_title else return empty string
str = paramValueArray[0] == 'ka_title' ? paramValueArray[1] : "";
return str;
}
}
Example
@Kishor O Yes.
If a button or link is going to exist on every KA then that means either
1. The creator of the KA will need to remember to include that when writing every KA
2. Or since every KA is displayed through the same page, just make a widget once and place it on the page. This way no one has to remember to build it into their KA
The widget that will hold the "create an incident button" can be built to get the data from the KA from getting the sys_id or the KA number that is in the URL when an article is viewed.
Note: The permalink usually has the knowledge article number. In the screenshot, this instance was taken using the Employee Center "Recommended for you" section
Building the widget:
There are many ways to go about implementing something like this, but what I'll show here is simply how to obtain the needed data from the KA from a widget outside the article and then pass that to the server to create the incident.
HTML Template
<div>
<button class="btn btn-primary pull-right m-b" ng-click="createIncident()">Create Incident</button>
</div>Server Script
(function() {
if(input && input.action == 'CREATE INCIDENT'){
//retrieve the KA based on number. This is a basic script. Adjust to meet the security needs of your
//company policies.
var kaGr = new GlideRecord('kb_knowledge');
//checks to see if the record exists and returns a boolean true false
if(kaGr.get('number', input.ka_number)){
//if record exists then it's accessible
var ka_name = kaGr.getValue('short_description')
//generate an incident with the provided details
var incGr = new GlideRecord('incident');
incGr.newRecord();
incGr.caller = gs.getUserID();
incGr.short_description = ka_name;
incGr.comments = "Made while viewing article " + input.ka_number;
incGr.insert();
//place details on the data object so client side can access
data.incident_details = {
"number": incGr.number.toString(),
"short_desc": incGr.short_description.toString()
}
}
}
})();
Client Controller
api.controller=function($scope,$location,spModal) {
var c = this;
$scope.createIncident = function(){
//client side way of getting URL parameters in AngularJS
var ka_number = $location.search().sysparm_article;
//call to the server passing your own input properties
c.server.get({
"action": "CREATE INCIDENT",
"ka_number": ka_number
}).then(function(resp){
//wait for a response from server side. Then popup a modal with details
spModal.alert('Incident ' + resp.data.incident_details.number + ' has been created<br>' + resp.data.incident_details.short_desc)
})
}
};
When the widget is complete place it where desired on the KA page
Now the button will appear at the bottom of any article viewed.
When that button is clicked it will generate an incident based with the name of the article as the short description and add a comment. Then a popup will display letting the user know that an incident was created.
Example
Note: Since this would be a custom widget the experience could be so much better though. But this is just a basic example of what is possible.
I hope this helps.
