logo

NJP

Add a Button to the List Component using Declarative Actions

Import · Jul 22, 2022 · article

Recently, Arnoud Kooi posted a really great article and video on Open an new UI Builder Tab from Workspace Record page Using Declarative Action. I would recommend reading and watching his post before going through this. His video/article was focused on adding a button to a form component/record page that then hooks into a UI Builder event. At the same time, someone asked me how they might do something like that from a list instead of a form, and while the steps are similar, they are slightly different.

In the following video, I show how to:

Steps from the video:

Conclusion

Hopefully, this video and article helped you understand how declarative actions can connect to events in UI Builder. You may be asking, though: Why do I need to connect to an event in UI Builder?

Well, you can read more about events in the docs and in the UI Builder developer site course, but basically, events are the way that you can make components, data resources, and other things talk to each on the UI Builder page. You can respond to an event and access its payload via one of our OOB event handlers or with a page script. Events can pop open modals, route the user to a new page, kick off a query or mutation of data, run a page script, etc. Being able to connect your DA to an event opens up some possibilities when working with forms and lists in experiences.

Labels:

image

View original source

https://www.servicenow.com/community/next-experience-articles/add-a-button-to-the-list-component-using-declarative-actions/ta-p/2331959