Web Components Descripción general de la selección de cuadrícula jerárquica

    Con la función Ignite UI for Web Components Select de Web Components cuadrícula jerárquica, puede interactuar fácilmente con los datos y manipularlos mediante simples interacciones con el ratón. Hay tres modos de selección disponibles:

    • Selección de fila
    • Selección de celda
    • Column selection

    Con la propiedad rowSelection, puede especificar:

    • Ninguno
    • Soltero
    • Selección múltiple

    Web Components Hierarchical Grid Selection Example

    En el ejemplo siguiente se muestran tres tipos de comportamientos de selección de celdas en el IgcHierarchicalGridComponent. Utilice los botones de abajo para activar cada uno de los modos de selección disponibles.

    Web Components Hierarchical Grid Selection Options

    El componente Ignite UI for Web Components IgcHierarchicalGridComponent proporciona tres modos de selección diferentes: selección de filas, selección de celdas y selección de columnas. De forma predeterminada, solo el modo de selección de celdas múltiples está habilitado en el IgcHierarchicalGridComponent. Para cambiar/habilitar el modo de selección, cellSelection puede usar rowSelection o selectable propiedades.

    Web Components Hierarchical Grid Row Selection

    La propiedad rowSelection le permite especificar las siguientes opciones:

    • None- La selección de filas se deshabilitaría para el IgcHierarchicalGridComponent.
    • Single- La selección de solo una fila dentro de la IgcHierarchicalGridComponent estaría disponible.
    • Multiple: la selección de varias filas estaría disponible usando los selectores de filas, con una combinación de teclas como Ctrl + clic, o presionando la tecla de espacio una vez que una celda está enfocada.
    • MultipleCascade- Este es un modo para la selección en cascada, lo que da como resultado la selección de todos los elementos secundarios en el árbol debajo del registro que el usuario selecciona con la interacción del usuario. En este modo, el estado de selección de un elemento primario depende completamente del estado de selección de sus elementos secundarios.

    Vaya al tema Selección de filas para obtener más información.

    Web Components Hierarchical Grid Cell Selection

    La propiedad cellSelection le permite especificar las siguientes opciones:

    • None- La selección de celda se deshabilitaría para el IgcHierarchicalGridComponent.
    • Single- La selección de una sola celda dentro de la IgcHierarchicalGridComponent estaría disponible.
    • Multiple- Actualmente, este es el estado predeterminado de la selección en el IgcHierarchicalGridComponent. La selección de varias celdas está disponible arrastrando el mouse sobre las celdas, después de hacer clic con el botón izquierdo del mouse continuamente.

    Vaya al tema Selección de celda para obtener más información.

    Web Components Hierarchical Grid Column Selection

    La selectable propiedad permite especificar las siguientes opciones para cada uno IgcColumnComponent. La selección de columna correspondiente se habilitará o deshabilitará si esta propiedad se establece en true o false, respectivamente.

    Esto lleva a las siguientes tres variaciones:

    • Selección única: haga clic con el mouse sobre la celda de la columna.
    • Selección de varias columnas: mantenga presionado Ctrl + clic del mouse sobre las celdas de la columna.
    • Selección de columnas de rango: mantener presionada la tecla Mayús + clic del mouse selecciona todo lo que se encuentra en el medio.

    Vaya al tema Selección de columnas para obtener más información.

    Known Issues and Limitations

    Cuando la cuadrícula no tiene primaryKey establecida y los escenarios de datos remotos están habilitados (al paginar, ordenar, filtrar y desplazar solicitudes de activación a un servidor remoto para recuperar los datos que se mostrarán en la cuadrícula), una fila perderá el siguiente estado después de un dato. solicitud completa:

    • Selección de fila
    • Fila Expandir/contraer
    • Edición de filas
    • Fijación de filas

    API References

    Additional Resources

    Nuestra comunidad es activa y siempre da la bienvenida a nuevas ideas.