Same category widget for knowledge base

Kvist · ‎10-16-2024

Hi!

I was trying, through the aid of AI, to create a widget for knowledge base that lists other articles with the same category as the article currently viewed (the widget is meant for the knowledge article view page). However, it doesn't work. Can anyone see what is wrong here?

HTML:

<div class="panel panel-default b panel-wrapper">
<div class="panel-heading b-b widget-header">
<h3>Related articles</h3>
<ul>
<li ng-repeat="article in data.related_articles">
<a ng-href="/kb_knowledge.do?sys_id={{article.sys_id}}">{{article.title}}</a>
</li>
</ul>
</div>
</div>

Server script:

(function() {
var currentArticle = $sp.getParameter('sys_id');
var currentCategory = '';

// Get the current article record
var articleGR = new GlideRecord('kb_knowledge');
if (articleGR.get(currentArticle)) {
currentCategory = articleGR.category;
}

// Only proceed if a category was found
if (currentCategory) {
// Query for articles in the same category
var relatedArticles = [];
var relatedGR = new GlideRecord('kb_knowledge');
relatedGR.addQuery('category', currentCategory); // Ensure this matches the category type
relatedGR.addQuery('sys_id', '!=', currentArticle); // Exclude the current article
relatedGR.query();

while (relatedGR.next()) {
relatedArticles.push({
title: relatedGR.short_description.toString(),
sys_id: relatedGR.sys_id.toString(),
});
}

data.related_articles = relatedArticles;
} else {
// If no category, set an empty array
data.related_articles = [];
}
})();

Bhavya11 · ‎10-17-2024

Hi @Kvist ,

you code is correct but you need to place this widget correctly then only it will appear correctly

for example i have create widget called widget test

with html

<div class="panel panel-default b panel-wrapper">
    <div class="panel-heading b-b widget-header">
        <h3>Related articles</h3>
        <ul>
            <li ng-repeat="article in data.related_articles">
                <a ng-href="/kb_knowledge.do?sys_id={{article.sys_id}}">{{article.title}}</a>
            </li>
        </ul>
    </div>
</div>

server side script

(function() {
    var currentArticle = $sp.getParameter('sys_id');
    var currentCategory = '';

    // Get the current article record
    var articleGR = new GlideRecord('kb_knowledge');
    if (articleGR.get(currentArticle)) {
        currentCategory = articleGR.category;
    }

    // Only proceed if a category was found
    if (currentCategory) {
        // Query for articles in the same category
        var relatedArticles = [];
        var relatedGR = new GlideRecord('kb_knowledge');
         relatedGR.addQuery('category', currentCategory); // Ensure this matches the category type
        relatedGR.addQuery('sys_id', '!=', currentArticle); // Exclude the current article
        relatedGR.query();

        while (relatedGR.next()) {
            relatedArticles.push({
                title: relatedGR.short_description.toString(),
                sys_id: relatedGR.sys_id.toString(),
            });
        }

        data.related_articles = relatedArticles;
    } else {
        // If no category, set an empty array
        data.related_articles = [];
    }
})();

after that you need to place this is in knowledge article view page like from OOTB we have "kb_article_view"

open the page then add like below

then it will start appearing like this

Please mark helpful & correct answer if it's really worthy for you.

Thanks,

BK

Kvist · ‎10-17-2024

Thank you for your response. It's still not working, and I think it may be because I have subcategories and am testing within one of those. Do you have a suggestion how to account for that? Because currently, it's not showing anything (probably because the main level is empty), But I only want to show articles from the exact category or sub category the article belongs to.

Bhavya11 · ‎10-17-2024

hi @Kvist ,

Please try this way in server script

(function() {
    var currentArticle = $sp.getParameter('sys_id');
    var currentCategory = '';
    var currentSubCategory = '';

    // Get the current article record
    var articleGR = new GlideRecord('kb_knowledge');
    if (articleGR.get(currentArticle)) {
        currentCategory = articleGR.getValue('kb_category');  // Get category value
        currentSubCategory = articleGR.getValue('kb_subcategory');  // Get subcategory value
    }

    // Proceed only if category or subcategory is found
    if (currentCategory || currentSubCategory) {
        var relatedArticles = [];
        var relatedGR = new GlideRecord('kb_knowledge');

        // If both category and subcategory exist, add both to the query
        if (currentCategory && currentSubCategory) {
            relatedGR.addQuery('kb_category', currentCategory);
            relatedGR.addQuery('kb_subcategory', currentSubCategory);  // Both must match
        } 
        // If only category exists, query by category
        else if (currentCategory) {
            relatedGR.addQuery('kb_category', currentCategory);
        } 
        // If only subcategory exists, query by subcategory
        else if (currentSubCategory) {
            relatedGR.addQuery('kb_subcategory', currentSubCategory);
        }

        relatedGR.addQuery('sys_id', '!=', currentArticle);  // Exclude the current article
        relatedGR.query();

        // Collect the related articles
        while (relatedGR.next()) {
            relatedArticles.push({
                title: relatedGR.getValue('short_description'),
                sys_id: relatedGR.getValue('sys_id'),
            });
        }

        data.related_articles = relatedArticles;
    } else {
        // If no category or subcategory found, set an empty array
        data.related_articles = [];
    }
})();

Please mark helpful & correct answer if it's really worthy for you.

Thanks,

BK

Kvist · ‎10-18-2024

Thank you for the attempt, but it is still not working for me.

I constructed a new version, and when testing it in a background script it performs perfectly. However, when inserted into the widget, nothing is displayed:

HTML:

<div>
<h3>Related Articles</h3>
<div ng-if="data.relatedArticles.length > 0">
<ul>
<li ng-repeat="article in data.relatedArticles">
<a ng-href="/kb_knowledge.do?sys_id={{article.sys_id}}">{{article.title}}</a>
</li>
</ul>
</div>
<div ng-if="data.relatedArticles.length === 0">
<p>No related articles found.</p>
</div>
</div>

Server script:

(function() {
var currentArticleSysId = $sp.getParameter('sys_id'); // Use the sys_id passed from the URL
var articles = [];

// Get the current article record
var articleGR = new GlideRecord('kb_knowledge');
if (articleGR.get(currentArticleSysId)) {
var currentCategorySysId = articleGR.kb_category.toString(); // Use kb_category field
data.currentArticleTitle = articleGR.short_description; // Pass current article title to client
data.currentCategorySysId = currentCategorySysId; // Pass category sys_id to client

// Query for articles in the same category
var relatedGR = new GlideRecord('kb_knowledge');
relatedGR.addQuery('kb_category', currentCategorySysId); // Ensure this matches the category type
relatedGR.addQuery('workflow_state', 'published'); // Only published articles
relatedGR.addQuery('sys_id', '!=', currentArticleSysId); // Exclude the current article
relatedGR.query();

while (relatedGR.next()) {
articles.push({
title: relatedGR.short_description.toString(),
sys_id: relatedGR.sys_id.toString(),
});
}

// Pass the articles to the client side
data.relatedArticles = articles;
} else {
gs.info("No current article found with sys_id: " + currentArticleSysId);
}
})();

Any idea why it's not working?