- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎04-10-2020 06:48 AM
Hi Experts,
I have a requirement where on a selection of a variable value on Service Portal, I should display a multi-line message which will have colored text in between and embedded URLs like we have for HTML pages.
It should be displayed only when a specific value is selected and the content will change based on different values. Example;
Information
This is a test message, it can have anything
Solved! Go to Solution.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎04-10-2020 07:18 AM
I recommend creating a new macro variable and configuring a widget for that one, which would just need the HTML required for the message and links. Then you can show/hide that variable with a UI Policy.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎04-10-2020 10:27 AM
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎04-10-2020 10:57 AM
So in your variable's widget record, you can access the g_form API so it works like you would in a client script. Inject $scope as a parameter in the Client Controller's function, and then add
var g_form = $scope.page.g_form;
With that, you can check the values of the Category variable and set a $scope variable to be printed in your HTML. See https://serviceportal.io/g_form-api-in-embedded-widgets/ for an example of using g_form in Client Controllers.
If you aren't familiar with how to pass $scope information to your HTML, I recommend reading some documentation from AngularJS: https://docs.angularjs.org/guide/scope
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎04-10-2020 12:14 PM
In the widget you can use event field.change event (This event is broadcasted when a field is updated on the form) to update the value in the widget.
Also use $scope.page.g_form.getValue to get the value of the field.
I creaed a sample code to achieve something similar.
Here primary_contact is my field name, You can replace it with your field name
Client Controller
function($scope, $rootScope, $timeout)
{
var c = this;
var detail = '';
$rootScope.$on("field.change",function(evt,parms)
{
if (parms.field.name == 'primary_contact')
{
detail = 'Primary contact Detail is ' + $scope.page.g_form.getValue('primary_contact');
c.data.detail = detail;
c.server.update();
}
});
}
Server Script :
(function() {
/* populate the 'data' object */
/* e.g., data.table = $sp.getValue('table'); */
data.detail = input.detail;
})();
HTML:
<div>
<!-- your widget template -->
<input type='text' ng-model="::c.data.detail">
</div>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎04-10-2020 11:03 PM
Hi Rajneesh,
Thank you for the code. But what I am looking is different.
Let say I have below code in HTML field but I want to display only a specific section of the HTML content not all.
<div><span style="font-size: 10pt;">Tablet is a device enrolled <span style="text-decoration: underline;">by requestor</span> and managed by MDM AirWatch</span></div>
<div> </div>
<div><span style="font-size: 10pt;">By default you'll get an <strong>Apple (IOS) tablet</strong></span></div>
<div><span style="font-size: 10pt;">Apple tablet's advantage is a fully configured device without any manual configuration</span></div>
<div> </div>
<div><span style="font-size: 10pt;">Nokia(Android) is a second choice</span></div>
<div> </div>
<div><strong><span style="font-size: 10pt;">Only request coming from official corporate tablet project will be approved. Other demand will be rejected</span></strong></div>
<div> </div>
<div><span style="font-size: 10pt;">On your tablet, you'll receive corporate APPs and access to corporate data. For more info, please visit <span style="color: #0000ff;">Mobile Device Management</span> IT </span><span style="font-size: 10pt;">Solus topic</span></div>
<div> </div>
<div><span style="font-size: 10pt;"><strong>Attention</strong>, if a SIM card is needed, please check the appropriate box in Accessories. Tablet and SIM card will be delivered together.</span></div>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎04-11-2020 02:28 AM
Thank you Justin and Rajneesh
https://community.servicenow.com/community?id=community_question&sys_id=11aa872ddb5cdbc01dcaf3231f96... This thread help me further.