DataGrid Element Reference Is Empty

I'm trying to pass the element reference of my DataGrid into my JS function when a user presses a certain key, but the ElementReference property on my referenced variable is empty. When I pass it to my JS function, it's blowing up. Am I doing something wrong here?

FYI, it doesn't seem to make a difference if I add an "id" attribute to the grid itself.

<RadzenDataGrid  @ref="_loadsGrid"
                            @onkeypress="@(e => KeyPressed(e))"
</RadzenDataGrid>

@code {

    private RadzenDataGrid<LoadEdit> _loadsGrid;

    private async void KeyPressed(Microsoft.AspNetCore.Components.Web.KeyboardEventArgs e)
    {
        bool hotKeyShortcut = e.AltKey || e.CtrlKey || e.ShiftKey;

        if (hotKeyShortcut)
        {
            bool saveEdit = new string[] { "Enter", "NumpadEnter" }.Contains(e.Code);
            if (saveEdit)
            {
                // _loadsGrid.Element.Id && _loadsGrid.Element.Context are both null.
                await JSRuntime.InvokeVoidAsync("manuallyTriggerChangeEvents", _loadsGrid.Element);
                return;
            }
        }
    }
}

EDIT
I now see where I can access the id via the attributes property on the grid reference. So now my question is, shouldn't I be able to pass in the element reference into my JS function and things be groovy, or am I misunderstanding that Element property?

Hi @beeterry,

It seems we haven't set the Element reference of the RadzenDataGrid. We will address that with the next release.

1 Like

Did this end up happening? Where is it in documentation? I'm trying to get the cell whree a click happened to be able to generate a Popup based on that data.

Yes.

That's unrelated to this thread. Use the CellClick event instead.

OK, I got that working. Now I'm trying to get the popup to position close to where the click event happened but can't seem to figure out what properties on DataGridCellMouseEventArgs would relate to CSS absolute position for top/left.