Adding Knowledge Base Message Box to a Form

0 Likes

Serena Service Request users have seen the following appear when they have entered words in the title field: 

This message box informs users that there is a knowledge base article that has matching words in its title. Users can easily view the existing articles, and then use an article to resolve the issue without help from the help desk. 

This feature only appears on the default Service Request submit form, but it can be added to other forms fairly easily. For example, you may want users to see the knowledge base results before submitting a "Reset password request" or "Cannot connect to intranet request." 

To do this:

  1. In SBM Composer, edit the form that you want the widget to appear on.
  2. If you want to track which item the user uses to resolve their problem, add a field such as Knowledge Base Article Id to the form. In the following example, we use KNOWLEDGE_ARTICLE_ID as the field and set it to the selected articles value when the user selects "Yes, resolve this issue." 
  3. Add an HTML/Javascript widget to the form where you want the message box to appear. Make sure that there is enough space on the form to add the item. 
  4. Add the following as the Content to the HTML/Javascript widget:
    <link rel="stylesheet" type="text/css" media="screen" href="styles/shell/srp/theme/jquery-ui-1.8.9.custom.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="styles/shell/srp/kbwidget.css" />
    $INCLUDE(jquery)
     <script type="text/javascript">
             if($().jquery == "1.4.2") \{                
                     //Move jQuery 1.4.2 to its own namespace
                     var jq142 = jQuery.noConflict(true)          
                     // load jQuery 1.5.1
    		document.write('<scr'   'ipt type="text/javascript" src="./solutions/javascript/jquery-1.5.1.min.js"></scr'   'ipt>');
             \}
             
    </script>
    $JAVASCRIPT(/shell/common/jquery-ui-1.8.9.custom.min.js)
    $INCLUDE(javascript/shell/srp/kbwidget.jsvar) 
    $JAVASCRIPT(shell/srp/kbwidget.js)
    
    <div id="kbwidgetdiv"></div>
    
    <script>
    
    
     $('#kbwidgetdiv').kbwidget( \{
           question: "This article solves my problem?",
           yestext: "Yes, resolve this issue",
           notext: "No",
           closetext: "Close",
        close: function(event, article) \{
    		SetFieldValue("KNOWLEDGE_ARTICLE_ID", article.id);
    		var tid = getsubmitButtonTransitionID();
    		PerformTransition(tid, true);
           \}
      \});
    
    
    AddChangeCallback("TITLE", function()\{
    	$('#kbwidgetdiv').kbwidget("search", GetFieldValue("TITLE"));
    \});
    
    AddSubmitCallback(function() \{
    	var sc = GetFieldValue("SUBMIT___CLOSE");
    	var articlePath = window.location.protocol   "//"   window.location.host   "/tmtrack/tmtrack.dll?shell=srp&StdPage&template=article&articleId="   GetFieldValue("KNOWLEDGE_ARTICLE_ID");
    	var priority = GetFieldValue("PRIORITY");
    
    	if(sc == "Yes") \{
    		SetFieldValue("RESOLUTION_SUMMARY", "Resolved using the following Knowledge Center article: <a href='"   articlePath   "' target='_blank'>"   GetFieldValue("KbArticleTitle")   "</a>");
    
    		if(priority == null || priority == "($STRING(TT_JS,IDS_STR_NONE))") \{
    			SetFieldValue("PRIORITY", "5");			
    			SetFieldValue("SEVERITY", "Low");
    			SetFieldValue("IMPACT", "Single User");
    			
    			var desc = GetFieldValue("Description");
    			var type = GetFieldValue("Type");
    			
    			if(type == "($STRING(TT_JS,IDS_STR_NONE))") \{
    				SetFieldValue("Type", "Other");
    			\}
    
    			if(desc == "") \{
    					SetFieldValue("Description", "($STRING(TT_JS,IDS_STR_NONE))");
    			\}
    		\}
    	\}
    \});
    
    </script>
  5. If you do not want to automatically submit the article when the user chooses "Yes, resolve this issue," remove the italicized lines from the previous javascript: 
    var tid = getsubmitButtonTransitionID();
    		PerformTransition(tid, true);
  6. Deploy the new process app. 

Note that you can modify the actions that occur when a user selects the knowledge base article by modifying the close function:

 close: function(event, article) \{
		SetFieldValue("KNOWLEDGE_ARTICLE_ID", article.id);
		var tid = getsubmitButtonTransitionID();
		PerformTransition(tid, true);
       \}

You can also modify the text displayed on the dialog by modifying the following options:

 question: "This article solves my problem?",
       yestext: "Yes, resolve this issue",
       notext: "No",
       closetext: "Close",

Labels:

How To-Best Practice
Comment List
Anonymous
  • Just an FYI I figured out the issue: You need two widgets, one named "JQuery_KBWidget" containing the following:
    $INCLUDE(jquery) if($().jquery == "1.4.2") \{ //Move jQuery 1.4.2 to its own namespace var jq142 = jQuery.noConflict(true); // load jQuery 1.5.1 document.write(''); \} $INCLUDE(javascript/shell/srp/kbwidget.jsvar) $JAVASCRIPT(shell/srp/kbwidget.js)
    The second named "KBSearchResults" containing:
    $('#kbwidgetdiv').kbwidget( \{ question: "This article solves my problem?", yestext: "Yes, resolve this issue", notext: "No", closetext: "Close", close: function(event, article) \{ SetFieldValue("SUBMIT___CLOSE", "Yes"); SetFieldValue("KNOWLEDGE_ARTICLE_ID", article.id); SetFieldValue("KbArticleTitle", article.title + " (Id: " + article.id + ")"); var tid = getsubmitButtonTransitionID(); PerformTransition(tid, true); \} \}); AddChangeCallback("TITLE", function()\{ $('#kbwidgetdiv').kbwidget("search", GetFieldValue("TITLE")); \}); AddSubmitCallback(function() \{ var sc = GetFieldValue("SUBMIT___CLOSE"); var articlePath = window.location.protocol + "//" + window.location.host + "/tmtrack/tmtrack.dll?shell=srp&StdPage&template=article&articleId=" + GetFieldValue("KNOWLEDGE_ARTICLE_ID"); var priority = GetFieldValue("PRIORITY"); if(sc == "Yes") \{ SetFieldValue("RESOLUTION_SUMMARY", "Resolved using the following Knowledge Center article: " + GetFieldValue("KbArticleTitle") + ""); if(priority == null || priority == "($STRING(TT_JS,IDS_STR_NONE))") \{ SetFieldValue("PRIORITY", "5"); SetFieldValue("SEVERITY", "Low"); SetFieldValue("IMPACT", "Single User"); var desc = GetFieldValue("Description"); var type = GetFieldValue("Type"); if(type == "($STRING(TT_JS,IDS_STR_NONE))") \{ SetFieldValue("Type", "Other"); \} if(desc == "") \{ SetFieldValue("Description", "($STRING(TT_JS,IDS_STR_NONE))"); \} \} \} \});
  • I'm having some trouble getting this to work in my environment (SBM 10.1.5.2 & SSM 5.2.0). The widget never populates when debugging in Chrome I'm seeing Uncaught TypeErrors; is there anything on a process app level that needs to be modified?
  • Thank you for adding this to SC! I mention this to a lot of prospects and customers and not I can point them to a quick reference!
Related Discussions
Recommended