Summary
In this article, I will demonstrate how to use a transform data broker to transform a list of records from the KB_Knowledge table and place them in a dropdown on a UI Builder page
Note
In order to populate a dropdown list with your own data, the data must be placed in an array in the following format:
[{"id":"l1","label":"List item 1"},{"id":"l2","label":"List item 2"},{"id":"l3","label":"List item 3"},{"id":"l4","label":"List item 4"},{"id":"l5","label":"List item 5"},{"id":"l6","label":"List item 6"}]
"id" and "label" are required fields, in that order. You cannot have any other fields within the json objects in order to populate the dropdown properly.
Example of what NOT to do: [{"id":"l1","label":"List item 1", "content": "this key-value pair should NOT be here"}]
|
Creating a transform data broker in Ui Builder
- Navigate to your UI Builder page
- Click the Data Resources icon on the bottom left
- Click +Add
-
- This will take you to a Data Broker Script form record on the now platform
|
|
|
4. Fill in the Name and Description fields. For example:
- Name = Practice transform for Dropdown
- Description = Practice server script to retrieve KA articles and populate a drop down with them
5. Fill in the properties
- Properties defines the structure of data (parameters) you need to pass in
- You can have many properties
- Example property is as follows:
-
- The “name” is how you will reference the data in your script
- ‘label” is the text that will appear next to the input field on UIB
- “description” is the text displayed when you click the info icon next to the label and input field on UIB
- “valueType” is “object” because we are passing in an array
- The “fieldType” is “json” since we are passing in a json array
Pasted here is the parameter I used:
[
{
"name": "data",
"label": "data",
"description": "Transforming JSON array into array for dropdown",
"readOnly": false,
"fieldType": "json",
"valueType": "object",
"mandatory": true
}
]
|
|
6. Writing the script to transform record array into format accepted for the dropdown
-
- Items in the dropdown are in the form of an array containing json objects. Each json object has an “id” and a “label”. We need to match this structure
- Here is the script used to transform the array of KB records into proper format
- Use input.”name” to access the data you passed in
Pasted here is the script I used:
function transform(input){
var returnArray = [];
var records = input.data;
for(var i in records){
var myObj = {};
myObj.label = records[i].number.displayValue;
myObj.id = records[i].sys_id.value;
returnArray.push(myObj);
//returnArray.push(JSON.stringify(myObj));
}
return returnArray;
}
|
 
|
|
7. Click Submit
8. Return to UI Builder and click the data resources icon
9. Click +Add in the lop left of the data resources pane
10. Select the application scope that contains your data broker
11. Select your newly created transform data broker
12. Click Add
|  |
| Use LookUp Records to retrieve data for transform data broker | |
|
13. Click the data resources icon and then click +Add
14. Select the Global Application
15. Scroll through the Data Resources and select Look Up Records
16. Click Add
-
- In this example, we will query the Knowledge Article table to retrieve an array of KAs
- You can use this method to retrieve an array of records from any table
|  |
|
17. Enter in the table name you wish to query
18. Make sure to return the sys_id and an identifier such as name, number, or label
19. Add optional features like conditions, max result, etc.
|  |
|
20.Now select the transform data broker you created
21. On the data field, click the data binding icon
22. Bind your Look Up Records data resource to your transform data broker
23. Select your dropdown
|  |
|
24.Scroll down to the Items field and click the dynamic data binding icon
25.Bind your transform data resource to the items field
|
|
| | |
