Customize a simple list or list control in UI builder.

hay
Tera Expert

Hello,

     I am working on a custom scoped app and using UI Builder. I am trying to show a drop down list column in a "Simple List" or "List Control"  with values from a reference field. The user will choose a specific value from this Drop down list which I will need to access and save it in another table.

 

I need the users column in the screen shot to be a Drop down list so the user can chose any value.

hay_0-1673228983007.png

 

 

Thank you for your help.

 

2 REPLIES 2

Nootan Bhat
Kilo Sage

@hay,

If you want to show users list in a dropdown, you need to create a transform data broker script and get the values from there. Dropdown component requires array of values in below 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"}]

 Example script:

table: sys_ux_data_broker_transform

script: 

function transform(){
	var dropdowns = [];
	var users = new GlideRecord('sys_user');
	users.addActiveQuery();
	users.query();
	while(users.next()){
		var name = users.name+'';
		dropdowns.push({"id":users.getUniqueValue(),"label":name});
	}
	return dropdowns;
}

Create an ACL:

Type - ux_data_broker

Operation- execute

Name - sys_id of above transform script.

 

In your UI builder add the data resource and in Dropdown component, bind the value dynamically: 

@data.test_dropdowns_1.output
 
You will get below result:
NootanBhat_0-1673240689256.png

 

Let me know if it helped.

 

Thanks,

 

hay
Tera Expert

@Nootan BhatThank you. However, The issue is how to make the Drop Down as a column in a "Simple list" or "List" control in UI Builder?