Web Components Tree Grid Selection Overview

    With the Ignite UI for Web Components Select feature in Web Components Tree Grid you can easily interact with and manipulate data using simple mouse interactions. There are three selection modes available:

    • Seleção de linha
    • Seleção de células
    • Column selection

    With the rowSelection property, you can specify:

    • Nenhum
    • Solteiro
    • Seleção múltipla

    Web Components Tree Grid Selection Example

    The sample below demonstrates three types of cell selection behaviors in the IgcTreeGridComponent. Use the buttons below to enable each of the available selection modes.

    Web Components Tree Grid Selection Options

    Web Components Tree Grid Row Selection

    permite rowSelection que você especifique as seguintes opções:

    • None - Row selection would be disabled for the IgcTreeGridComponent.
    • Single - Selection of only one row within the IgcTreeGridComponent would be available.
    • Multiple- A seleção de várias linhas estaria disponível usando os seletores de linha, com uma combinação de teclas como ctrl + clique, ou pressionando a tecla de espaço quando uma célula estiver em foco.
    • MultipleCascade - This is a mode for cascading selection, resulting in the selection of all children in the tree below the record that the user selects with user interaction. In this mode a parent's selection state entirely depends on the selection state of its children.

    Vá para o tópico Seleção de linha para obter mais informações.

    Web Components Tree Grid Cell Selection

    permite cellSelection que você especifique as seguintes opções:

    • None - Cell selection would be disabled for the IgcTreeGridComponent.
    • Single - Selection of only one cell within the IgcTreeGridComponent would be available.
    • Multiple - Currently, this is the default state of the selection in the IgcTreeGridComponent. Multi-cell selection is available by mouse dragging over the cells, after a left button mouse clicked continuously.

    Vá para o tópico Seleção de célula para obter mais informações.

    Web Components Tree Grid Column Selection

    The selectable property enables you to specify the following options for each IgcColumnComponent. The corresponding column selection will be enabled or disabled if this property is set to true or false, respectively.

    Isso leva às três variações seguintes:

    • Seleção única -mouse click sobre a célula da coluna.
    • Seleção de várias colunas - segurando ctrl + mouse click sobre as células da coluna.
    • Seleção de coluna de intervalo - segurando shift + mouse click seleciona tudo no meio.

    Acesse o tópico Seleção de coluna para obter mais informações.

    Known Issues and Limitations

    When the grid has no primaryKey set and remote data scenarios are enabled (when paging, sorting, filtering, scrolling trigger requests to a remote server to retrieve the data to be displayed in the grid), a row will lose the following state after a data request completes:

    • Seleção de linha
    • Expandir/recolher linha
    • Edição de linha
    • Fixação de linha

    API References

    Additional Resources

    Nossa comunidade é ativa e sempre acolhedora para novas ideias.