Search code examples
javascriptoracle-apex

Get the ID of a selected row from Interactive Grid and set the value to another page's item

I'm trying to get the ID from a selected row in an Interactive Grid, set it to an hidden page item, and when clicking on a button redirecting to another page, setting the value of the hidden item from the previous page to an item of the target page.

The simplified use-case is : There's is a master/sub-master/detail page. When clicking on the master record, the submaster refresh and display the data related to the master report. When clicking the submaster, the detail report refresh and display related data. When the user click on the submaster, I want to store the ID of the row in an hidden item. When the user wants to create a new record, I want the button to pass the value of the Hidden Item to an Item on the target page (Popup-LOV).

Here's what I did :

Hiden Item

Hidden item

Dynamic action Code to store the value of the Item

  • Selection change

Event

const model = this.data.model,
    records = this.data.selectedRecords;
let values = records.map( r => model.getValue( r, "PK_CONCE" ) ); 

apex.item( "P16_PK_CONCE" ).setValue( values[0] );
console.log(apex.item("P16_PK_CONCE").getValue());

The value is passed to the hidden item, I can track it using console.log :

console_log debug

Button config

button config

However, when going to the target page using the button, the value is not passed

button_config

The hidden item value still is accessible using $v(ITEM) command, but the target item is empty debug_target_page

I don't understand what's the problem here, is the value not persisted through pages when dynamically being set in JavaScript ? Is there another way to do it ?

Thanks in advance

Solution

  • When the page is rendered, the link to the buttons are already generated. So in your case, when the page is shown, the link to the button is created with null item value. Easiest and the most appropriate way to overcome this, change your button behaviour to: defined by dynamic action. Then create a dynamic action with the action "Execute Javascript Code" with the code:

    apex.server.process('PREPARE_URL', {
        x01: $v('P16_PK_CONCE')
}, { success: function (pData) {           
            var funcBody = pData.url.replace(/^"javascript:/, '').replace(/\"$/, '');
            new Function(funcBody).call(window);
        }
    }
);

    Then create a Ajax process to your page name 'PREPARE_URL' as:

    DECLARE
    l_url varchar2(2000);
    l_app number := v('APP_ID');
    l_session number := v('APP_SESSION');
    l_values varchar2(2000);
BEGIN
    l_values := apex_application.g_x01;
    l_url := apex_page.get_url(
        p_application => :APP_ID,
        p_page        => 19,
        p_items       => 'P19_FK_CONCE_DEF',
        p_values      => l_values
    );
    apex_json.open_object;
    apex_json.write('success', true);
    apex_json.write('url', l_url);
    apex_json.close_object;
END;