How to display Checklists on Configurable Workspace

[Shilpa Jana Yel]

Checklists are a small but powerful functionality used by any process. This works well on the platform view and many of my clients have been using it over the period of time. It takes the guess-work out and gives a simple set of instructions for agents to follow.

However, we are slowly moving towards UI builder and Configurable workspaces ie the NEXT Experience! Hence presenting Checklists for agents in Workspace view is paramount. Following are the steps on how we can do it.

Create a Checklist tab option

• Open CSM/FSM Configurable Workspace in UI Builder
• Open the 'Record' Page
  • 
• Open the Contextual sidebar (In the Content section)
• Add a new tab 'Checklist'
  • 
• The newly created Checklist tab will open

Add components to Checklist tab

• Always create a container before you add components
• Then add a Heading component and set label to 'Checklist'
• Finally add the Checklist component.
• Dont forget to SAVE the tab. 

                   

Import checklists for the case record

• Now we import the checklist associated to the case, so we can display it in the workspace view
• Create a Data resource instance
  • Select application 'Global' and Data resources->Server data-> Look Up Records
  • A data resource will be added. I prefer renaming it to 'Fetch checklist items'
  • Set this data resource to import records from Checklist item(checklist_item) table where
    • Checklist.table = sn_customerservice_case
    • Checklist.document = @context.props.sysId  (this is a dynamic data binding and not a simple text)
  • Add following return fields
    • Sys id
    • Name
    • Order
    • Complete
  • Set max results to 25 or less. 
  • Dont forget to SAVE 

           

• Set checklist configuration
  • Select checklist component.
  • Go to the config pane
  • Set 'Checkbox items' object to script and add this script
  • Dont forget to SAVE
• Special Sauce
  • Checklists are still not going to work on the workspace because, for some reason that i dont know, page properties (table and sysId) are not sent to then tab. Hence our dynamic data binding in the data resource does not work
  • Work around - 
    • NOTE: Before you start working on following steps, make sure you see checklist in the configurable workspace first. You can remove the 2nd condition in the data resource and that should show you all checklist items. This is VERY important, not sure why.
    • Go to 'Now Experience Framework-> Building blocks-> UX Page Definitions'
    • Find the 'Checklist' macroponent
    • Update the Properties as given in the screenshot
    • 
    • This will make sure that the properties are sent to tab
    • Now go back  to UI Builder Checklist page. 
    • When to select the page configuration, you should now see two properties. Set them to dynamic data binding
    • 
    • As soon as i tried to set dynamic data binding on table property, my screen config section froze and i couldnt make any changes to sysId property. If this happens to you then go back to the 'Checklist' UX Macroponent Definition. On this page , in the 'Parent Screens' related list, you will find the 'Checklist default' page. Go to this record and the configuration manually
    • 

Update checklist record when completed

• This part is very simple
• Create a new data resource instance to update the checklist item record

         

• Create a page script 

         

• Add this page script to checklist event 

         

Final Result - Voila!!

Lastly I want to thank ServiceNow for helping me make this work.