Setting Popup LOV Interactive Grid Column Value with JS

⚠️ Situation

Recently, I needed to automatically insert and populate a Popup LOV column in an Interactive Grid (IG) row using a new ID returned from a modal form after inserting a new record.

Initially, I achieved the population of the column using the IG model interface described in the APEX API JSDoc. However, I faced an issue: the return value appeared correctly, but the display text didn't show up immediately, only being rendered after clicking the cell.

☑️ Steps

At first, I used model.setValue() by passing a single value as shown below:

model.setValue(record, 'COLUMN_NAME', 'MY_NEW_ID');

With the example above, I was facing the problem described in the first section of this post.

But reading the documentation, I found this:

Another special case is for field values that have a display value in addition to their intrinsic value. These composite values have the form: { d: "display value", v: value } When comparing values during model#setValue only the value is considered not the display value.

So, to fix this, APEX expects a composite object when using model.setValue(), explicitly defining the display value as well as the returning value:

model.setValue(record, 'COLUMN_NAME', { v: 'NEW_ID', d: 'NEW_ID_DISPLAY_VALUE' });

This ensures that the corresponding display value is rendered immediately, without user interaction.

✅ Example

// Assuming you've created a new record through a modal form,
// retrieve both values to your X page using the Dialog Close process
var value = apex.item('PX_NEW_ID').getValue(); // = 777
var display = apex.item('PX_NEW_ID_DISPLAY_VALUE').getValue(); // = Your new record

var model = apex.region('IG_STATIC_ID').widget().interactiveGrid('getViews', 'grid').model;
var newRecId = model.insertNewRecord();
var record = model.getRecord(newRecId);

model.setValue(record, 'COLUMN_NAME', { v: value, d: display });

This approach immediately displays "Your new record" instead of the ID "777" in the Popup LOV cell.

🧠 Tips

If you don’t know the display value ahead of time (or aren’t creating the new record in a modal dialog form like me), there are alternative ways to retrieve it:

  • Computation: Create a page computation on a hidden item that queries the display value, so it’s available on your page.

  • AJAX Callback Process: Use apex.server.process to call PL/SQL directly from your JavaScript code, fetching the display value dynamically right before calling setValue() on your IG model.

🙏 Thank you for reading!

I hope this post was helpful and clarified how to handle Popup LOV columns in your APEX Interactive Grids. If you found this useful, please like, share, and follow for more APEX tips and tricks.

See you guys soon!

2
Subscribe to my newsletter

Read articles from Lázzaro Daudt da Costa directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Lázzaro Daudt da Costa
Lázzaro Daudt da Costa

Passionate about building solutions with Oracle APEX, Cloud Solutions integrations, AI and efficient PL/SQL development. I share learnings, and insights here to help fellow developers optimize their solutions. 🚀👨‍💻