Hola, estoy trabajando en el desarrollo de una cuadrícula de datos dentro de una aplicación Blazor Server. Espero evitar tanto JavaScript como sea posible (porque soy nuevo en esto), pero creo que necesito JavaScript para esto. Mi cuadrícula de datos está llena de celdas enfocables (entradas) y el contenido se está virtualizando. Necesito detener la funcionalidad de desplazamiento con las teclas de flecha en el componente Datagrid. Una solución temporal que encontré fue colocar esto:

 window.addEventListener("keydown", function(e) { if(["Space","ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].indexOf(e.code) > -1) { e.preventDefault(); } }, false);

dentro de la página _Host.cshtml. Funciona para evitar el desplazamiento con las teclas de flecha.

Aquí está el problema: solo necesito evitar el evento de la tecla de flecha en un componente de cuadrícula de datos en lugar de en toda la ventana, porque uso las teclas de flecha en otras partes de la aplicación. ¿Cómo puedo conseguir esto?

EDITAR

Intenté hacer referencia a la cuadrícula directamente por Id sin éxito. Nuevamente, este código está en _Host.cshtml y el usuario navega por varias páginas antes de llegar a Datagrid. Solo hay un elemento en la cuadrícula de datos que contiene el Id "CustomDataGrid".

 var tar = document.GetElementById('CustomDataGrid'); tar.addEventListener("keydown", function (e) { if (["Space", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].indexOf(e.code) > -1) { e.preventDefault(); } }, false);