How to open/preview reference field records in UI builder?
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
05-13-2022 11:27 AM
Basically ask the title asks: how do you open/preview reference field records in UI builder (see screenshot below)?
I've made a UI builder page using the OOTB Record template as a base. I've tried just using both the read-only template and using a fully customizable template but I have had zero success in getting the preview record and magnify glass buttons to work.
The buttons don't work for OOTB using the read-only template so that isn't good news.
When using the fully customizable template, I tried hooking into the Preview Record and Item Selected events on the record tabs component, to no avail. I added a client script that console logs a message as the event handler for those two events, but I never got the message to log in my console.
How do I get this to work? I'm assuming there is just some configuration I'm missing. Am I hooking into the wrong events? Am I putting the event handlers in the wrong place? (Right now I am putting them in the record tabs component, but is the proper way to do it to put them in the page-level event handlers or maybe into an event handler for a data source?)
As per usual, documentation is not helping.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
01-11-2023 12:41 PM
I've been trying to figure this one out too and haven't really found another post with an answer on this. Don't know if this one is already solved, but have you added the appropriate record to the sys_ux_addon_event_mapping table like this one? I tried it in the picture below and it seems to be working for me, but let me know if it solves this issue for you.
UX Add-on Event Mapping
Haven't really found any info on this table and behavior, so could be completely wrong, but the fields should be filled out like this:
- Event Mapping Name - Any name you would like to give it
- Description - Any appropriate description
- Source element ID - the ID of the element/component on the page that has the preview icon
- I was using the Record Tabs component to display the form which has the id "record_tabs_3"
- Parent Macroponent - Essentially the page or macroponent you're working on
- Source declarative action - the action the user is clicking on in the form
- For the reference preview icon, it's "open_record"
- For the reference search icon (magnifying glass) it should be the "ref_search" action
- All of the actions appear to exist on the sys_declarative_action_assignment table
- Target Event - A handled event on the body of the page that you created in UI Builder
- I called mine RECORD#NAV_ITEM_SELECTED but you can name it whatever you want when you create it
- Target Payload Mapping - I copied the JSON in the picture above from an oob mapping, but effectively it looks like this is what's going to be passed to the event variable in ui builder
- You may have to change the route if you app doesn't have a "record" page
- You can probably have other fields beyond the table and sysId. You would just need to grab them "Specify client action" field from the source declarative action
Again, I may be way off on this, but once you get the event setup, you can just trigger a viewport modal that contains the preview info you want. If you're trying to update a field value and using the reference lookup, the process is similar, but you would need to use a Glide Form "SET_VALUE" action that's triggered from an event when the user clicks on the row.
Let me know if this solves your issue or if you know of a better way to do this.