How to retrieve data with a Script Include in UI Builder?

gjz
Mega Sage

I'm really new to UI Builder and have a business requirement that I need help with.

 

Currently, in the core UI forms for catalog tasks (SCTASK), we have a UI Macro on the form that provides a list of consolidated work notes and user comments for the entire request so none get missed when fulfilling a request.  The UI macro calls a script include that gathers the data based on two parameters passed - the SCTASK sysid and the RITM sysid.

 

I need the same functionality for Service Operations Workspace and I'm stuck on how to create a data resource to call the script include.  I assume I can pass parameters to the data resource with a client state parameter or field value from the form controller, I just don't know how to do that in a data resource, or even what kind of data resource since I want to re-use the script include code.

 

Can someone help me out, please?

6 REPLIES 6

bonjarney
Kilo Contributor
UI Builder doesn't have a "Script" data resource type — you can't run server-side GlideRecord code directly from a UIB page. You need a Scripted REST API as the intermediary between your Script Include and UI Builder.

The architecture: `Script Include → Scripted REST API → REST Data Resource in UIB → Component`

pr8172510
Kilo Guru

Hi gjz,

Good question — this is a very common challenge when moving from classic UI (UI Macro) to UI Builder / Workspace.


1. Key point (why you're stuck)

In UI Builder:

  • You cannot directly call a Script Include like you do in UI Macros
  • UI Builder works through Data Resources (APIs)

 So your Script Include must be exposed via an API first


2. Recommended approach → Wrap Script Include in Scripted REST API (best practice)

This is the clean and supported way.


Step 1: Create Scripted REST API

  • Go to: System Web Services → Scripted REST APIs
  • Create a new API + Resource

Example:

(function process(/*RESTAPIRequest*/ request, /*RESTAPIResponse*/ response) {

var sctask = request.queryParams.sctask;
var ritm = request.queryParams.ritm;

var result = new MyScriptInclude().getConsolidatedNotes(sctask, ritm);

response.setBody(result);

})(request, response);

Step 2: Reuse your Script Include

Make sure your Script Include:

  • Is Server-side
  • Has a callable function     
    var MyScriptInclude = Class.create();
    MyScriptInclude.prototype = {
    getConsolidatedNotes: function(sctask, ritm) {
    // your existing logic
    }
    };   

     

    3. Step 3: Create Data Resource in UI Builder

    In UI Builder:

    • Add Data Resource → REST API
    • Configure:
      • Method: GET
      • Endpoint: your scripted API

    Pass parameters like:

     

     
    /api/x_your_scope/your_api? sctask=${state.sctask_sys_id}&ritm=${state.ritm_sys_id}
     

    4. Passing parameters (important)

    You were right — use:

    Client State Parameters
    ✔ OR Record fields (from form context)

    Example:

    • @context.record.sys_id → SCTASK
    • @context.record.request_item → RITM

    5. Bind data to component

    Once Data Resource is set:

    • Bind response to:
      • Data Table
      • Text / List component
      • Custom component

    6. Alternative (not recommended)

    You can use:

    • GlideAjax (client script style)

    But:

     Not aligned with UI Builder architecture
    Harder to maintain


    7. Best practice

    ✔ Use Scripted REST API as wrapper
    ✔ Keep Script Include reusable (as you already have )
    ✔ Use Client State for dynamic params

tejarekanda
Tera Expert

Hi @gjz ,

Follow this youtube video
https://www.youtube.com/watch?v=bXgN8_zBQ-I
If my response helped, mark it as helpful and accept the solution.

Regards.

A "Transform Data Resource" in ServiceNow's UI Builder is a type of data source that allows you to take input data from another source and manipulate or reformat it into a different structure using a script, essentially transforming the data to fit the needs of your UI component before displaying

Henalu
Tera Contributor

Hi! In Breaking Trail I have an article that covers something very similar to what you're looking for: Cómo llamar a un Script Include desde un Client Script de UI Builder | Breaking Trail

 

It walks through how to reuse your Script Include logic in UI Builder by setting up a Scripted REST Resource as an intermediary and calling it from your client code. The pattern handles parameter passing and response handling, which should help you solve your data resource challenge.

 

Give it a read — it might point you in the right direction for your implementation.