One of the powerful features of the new Helsinki Service Portal is the integrated “record watcher” capability. This allows widgets to update in near realtime as the data changes in the database. In this tutorial we will build a sample To Do (task ) app that uses two widgets, one for creating records, and the second for showing the list of tasks.
Nathan Firth
Founder of NewRocket, Inc. and ServiceNow architect, web developer, and entrepreneur with over 20 years experience in web development. Former senior engineer and team lead of Service Portal at ServiceNow. I'm originally from Sweden, but currently living in San Diego, CA. I have a beautiful wife and three amazing kids.
Awesome
Form where I can get more info on spUtil.
Superb!
is it possible to make custom filters in service portal? there is no option in angular providers.
I tried to define custom filter in link function of a widget by adding it to angular.module(‘sn.$sp’) but its not working. may b I am missing something(injection related)
You can create a filter as a dependency and then associate it with the widget.
Hi Nathan, I have created a filter as a dependency and able to filter out data based on entered value in search field(it filters data based on short description column). But i have a requirement where i need to filter out data based on a reference type table field. Could you tell me how to do that?
Nice!
Like it, nice work done.
Problem that I have is that my SN instance doesnt insert record – I made copy paste version of this demo and seems to be not working – doesnt insert data into table at all
I tried this on Helsinki and on Geneva too – same result
Do I need somehow reference angular JS library from UI page ?
/Petr
OK, have it, but how I can make it as UI page on Geneva ?
I have problem to insert data to table – processing script doesnt work
thank you for help
/Petr
This will not work in a UI page… this is specific to Service Portal.
Thanks
/Petr
Awesome
Awesome Nathan 🙂
Hi Nathan,
I have one question , shall we call server script by ng-click.
Ex:
Based on the user click i want to get the result from Server and display to the user.
Regards,
Harish Murikinati.
Harish, sure you can use the exact same methods from this tutorial to accomplish that… but instead of responding to a record watcher event just create a method on scope and call it from ng-click.
Hi Nathan,
Thanks for reply , yes im able to call client controller function from ng-click, from client controller i want to call a one more method
Ex: Update() , from client i want call server update method.
Delete(), from client i want to call server delete method.
Regards,
Harish Murikinati.
Nate,
Quick question, how would you structure the ng-click on the task list in order to modify the table record to change the status on completion?
Kiernan, I was actually going to include that in the video but the video was already getting too long. You would put an ng-model and ng-change on the checkbox that called a function in the controller. The function would just use server.update() method (just like in the “add task widget”) to call the server script where you would check for “input” and then use GlideRecord to update the appropriate record.
Hi Nathan,
Thanks for your post it looks great. Got a question for you. We are trying to build charts in service portal with drill down capability to data similar to charts in ‘Reporting’ which comes out of the box in SNOW. I understand for chart we have to use third party charting library e.g fusion chart/high charts etc but just wondering if we have anything out of the box which provides chart types widgets in service portal with drill down to data capabilities e.g if I got pie chart with ‘Direct 10% & Indirect 90%’ and when click on Indirect 90% it shows me the related records. Again I knew we can achieve all this with AngularJs but do we have anything out of the box chart type widget in service portal with these capabilities.
Thanks
Muhammad
Muhammad, this is not something that ships out-of-box. It wouldn’t be hard to build, and definitely something that I will develop as soon as I have time.
Hi Nathan,
We recently started using Service portal to build our portal site. We have couple of Order Guides need to be placed on portal site. But we found that service portal is not supporting order guide upgrade. Is there any way to make order guide work on service portal.
Or else we need to stop all the work done on service portal and go back to CMS to build our portal Site. Please let me know.
Sachin, order guides do work in Service Portal… however they may not function exactly as in the platform UI. Specifically what is it that is not working? The good news with Service Portal is that you can always edit the widgets and add in support for any missing functionality. Shoot me an email, and perhaps we can take a closer look. I’m currently working on a new set of widgets that enhance and expand the functionality of the service catalog in Service Portal so if this is not something currently lacking I might be able to find a solution.
Wher can I get code f=of this, just to try in my personal instance ?
Nathan,
How do we pass data from one widget to another ?
Here we insert a data into a table, using glideRecord and recordwatch we are displaying the records.
My requirement is to display incident list (name, short description) in one widget and clicking on each incident should provide more details of than incident on other widget.
I used $broadcast and $on to display widget on click. But I cannot get the required incident details. Please let me know what has to be done here.
The correct way to do this is using Angular events, there are plenty of example widgets that you can look at. Look at the widgets on the “ticket” page, they all communicate via broadcasting/emitting events.
Hi Nathan,
If i have to do a record watch for sys_user how do i fo it? Example, i want to update the scope when the users location changes.. I wrote something like below: but the message doesnt show up.
function($scope, spUtil) {
/* widget controller */
var c = this;
spUtil.recordWatch($scope, “sys_user”, “time_zone”, function(name, data) {
data.greeting = ‘Record watch has executed ‘;
spUtil.update($scope);
});
}
Hi Nathan,
Thanks for the writing Awesome Blogs.
Is there any way to unwatch the record.
in may case im watching records with one condtion…now when record gets updated and doesnt match the condition..record watcher still listens for update. how to stop it(is there any way to destroy recordwatcher?)
Hello,
Looks great, but is there a way to refresh the widget without needing a record watcher, so just having a button that says refresh list and when you click it the list widget reloads?
Thanks
Hi Nathan,
I’m using Record Watcher in my widget, trying to watch the record updates on the child tables. The record watcher works on child tables. However it doesn’t work on the base/parent table. I was trying to watch the parent table but any update on the child tables doesn’t seem trigger the change.
These are custom tables created.
My approvals count in portal header menu is not getting updated automatically when an approval is getting approved.. Can I use record watcher to automatically update the count? If yes, how can I do that. Please help me!