APEX

We have an Interactive Grid with a custom action menu, we are finding if you click on menus across different rows without closing down the previous menu you get the previous rows menu.

The behaviour can be observed on this test case https://apex.oracle.com/pls/apex/r/trng/customigactionmenu/home

The code from the “Function and Global Variable Declaration” section of the page is shown below

$(function () {

    function isRowSelected(rowId) {
        /* Check if the selection includes Digital Evidence items */
        const view$ = apex.region("testIG").call("getViews", "grid");
        const selectedId = view$.model.getRecordId(view$.getContextRecord( ( document.activeElement) )[0]);
         console.log('Selected Row: '+selectedId);
        /* Check if current row is Digital Evidence Item */
        if (selectedId==rowId)
        {
            return true;
        }
        else
        {
            return false;
        }
    }
   
    $("#testIG").on("interactivegridviewchange", function (event, data) {
        
        var actions = apex.region("testIG").widget().interactiveGrid("getActions");
        actions.remove("selection-refresh");
        actions.remove("selection-revert");
        actions.remove("selection-copy");
        actions.remove("selection-delete");
        actions.remove("row-delete");
        actions.remove("row-revert");
        actions.remove("row-refresh");
        actions.remove("single-row-view");

        
        if (data.view === "grid" && data.created) {
            var view$ = apex.region("testIG").call("getViews", "grid");

            // Row Actions
            if (view$.rowActionMenu$) {
                var menu$ = view$.rowActionMenu$.menu("option").items;

                menu$.splice(0, 0, {
                    type: "action",
                    label: "Action for Row 1",
                        action: function (menu, element) {
                            alert("Action For Row 1");
                        },
                        hide: function (menu) {
                            return !isRowSelected(1);
                        }
                    });

                menu$.splice(1, 0, {
                    type: "action",
                    label: "Action for Row 2",
                    action: function (menu, element) {
                        alert("Action For Row 2");
                    },
                        hide: function (menu) {
                            return !isRowSelected(2);
                        }
                });

                menu$.splice(2, 0, {
                    type: "action",
                    label: "Action for Row 3",
                    action: function (menu, element) {
                        alert("Action For Row 3");
                    },
                        hide: function (menu) {
                            return !isRowSelected(3);
                        }
                });
                   
            }
            
        }
    });
});  

Are we doing something wrong or is this a bug?

Thanks James