React Single Selection ComboBox

    The React ComboBox supports single-selection mode and quick filtering of the list of items via the main input prompt. Users can quickly type in the item they are looking for and be presented with a list of options. Upon pressing the enter key, the first highlighted match will be selected.

    React Single Selection Example

    Para permitir la selección única y el filtrado rápido, establece lasingleSelect propiedad en elIgrCombo. La experiencia de usuario y la navegación con teclado permanecerán mayormente iguales, pero en lugar de tener que escribir tu consulta de búsqueda en un cuadro de filtrado especial sobre la lista de opciones, se usará el cuadro principal de entrada.

    <IgrCombo singleSelect></IgrCombo>
    

    Selection API

    La API de selección para un ComboBox con lasingleSelect propiedad aplicada permanece mayormente igual, sin embargo, hay algunas diferencias importantes respecto a las ComboBoxes que no tienen esta propiedad establecida.

    La principal diferencia es que solo se puede seleccionar un elemento en cada momento. Por ejemplo, si has especificado avalueKey para tu componente de combo, pasar más de un objeto a losselect métodosdeselect no tendrá ningún efecto. Esto también significa que cualquier elemento previamente seleccionado será desseleccionado automáticamente al hacer una nueva selección.

    A continuación se explica cómo seleccionar/deseleccionar un elemento mediante programación en un combo de selección única.

    Selecting items

    // select the item matching the 'BG01' value of the value key field.
    comboRef.current.select('BG01');
    

    Para deseleccionar un elemento sin hacer una nueva selección, llama aldeselect método.

    Deselección de elementos

    // deselect the item matching the 'BG01' value of the value key field.
    comboRef.current.deselect('BG01');
    

    Disabled features

    Naturalmente, algunas opciones de configuración no tendrán efecto en un ComboBox de selección única.

    Placeholder

    Asignar un valor a laplaceholderSearch propiedad no dará ningún resultado, ya que la entrada de filtrado que normalmente se coloca por encima de la lista de opciones no estará presente en una única caja comboBox de selección.

    Auto-focusing the list of options

    Poner laautofocusList opción en una sola ComboBox de selección tampoco tendrá efecto.

    Keyboard Navigation

    La navegación con el teclado debe comportarse igual que con un ComboBox de selección no única, excepto por el hecho de que ahora la entrada principal desempeña el papel de un mensaje de filtrado y, por lo tanto, todas las acciones del teclado que se aplican a la entrada de filtrado/búsqueda se mueven al menú principal. mensaje de entrada.

    Other Features

    Todas las demás funciones se comportarán igual que en un componente ComboBox que no sea de selección única.

    API Reference

    Additional Resources