it-swarm-es.com

¿Cómo manejar las selecciones con muchas opciones?

En una aplicación web, digamos que tengo una lista de opciones para que el usuario seleccione. Normalmente usaría un menú desplegable en este caso, si hay un número razonablemente pequeño de opciones, pero ¿cómo debería abordar esto de manera diferente si hay 50 opciones? o 100? o 1000?

10
GSto

¿Quizás combinar un enfoque de dos paneles con una búsqueda?

Django admin multiselect

La interfaz de usuario se filtra dinámicamente en el lado del cliente a medida que escribe en el cuadro de búsqueda. Me gusta más que solo buscar, porque puedes descubrir cuáles son todas las opciones.

Para obtener puntos de bonificación, puede construir esto sobre la marcha desde un control múltiple/selección regular.

11
Chase Seibert

Un par de ideas:

  1. Cuadro combinado (o algún tipo de búsqueda con autocompletar)
  2. Divida las opciones en grupos y deje que el usuario seleccione primero el grupo, luego la opción de la lista que sería más pequeña en este caso
5
Kostya

Bueno, si tiene una aplicación donde un usuario puede seleccionar entre miles de opciones, mi primera respuesta sería que ha diseñado algo incorrectamente. Intente alejarse y considerar la arquitectura de la información que conduce a tantas opciones y vea qué puede hacer al respecto. ¿El usuario realmente necesita todas esas opciones? ¿Puedes deshacerte de algunos para ella o elegir algunos valores predeterminados razonables? ¿Cómo lidias con el problema de la paradoja de la elección?

Pero en términos más prácticos, intente dividir la información en categorías y presentarlas de esa manera. Podría ser más útil si supiera para qué información está diseñando, ya que eso a menudo influye en el tipo de visualización o controles que puede usar.

Considere zonas horarias. Puede ser realmente específico y ofrecer cada zona horaria individual, lo que lleva a una lista enorme en la que debe hacer un trabajo duro para que el usuario pueda digerirlo. O bien, puede elegir solo las zonas horarias más cercanas a la mayoría de los lugares, lo que puede dejar a algunos usuarios excepcionales, pero cubrir el 99% de ellos.

Lo mismo con elegir un momento para un evento. Ser específico significa que un usuario puede elegir hasta el minuto. 60 menús desplegables de elementos? O puede segmentar el tiempo en 5 minutos. De repente, el usuario solo tiene que elegir entre 12 opciones, y es lo suficientemente específico para el caso de uso.

3
Rahul

para tantas opciones cualquier tipo de selección múltiple sería molesto. Piensa en un clic equivocado y falta media hora.

Debes usar 2 cajas con flechas como estaalt text

no es muy difícil hacerlo con unas pocas líneas de JS

1
Sruly
  1. Use un menú desplegable con todos los elementos ordenados lógicamente.
    Por ejemplo: una lista de zonas horarias se ordena de acuerdo con el desplazamiento, una lista de países se ordena alfabéticamente.
    Además, asegúrese de que el usuario pueda escribir el valor y automáticamente sugerirá/saltará al correcto.

  2. Agrúpelos lógicamente. Si solo se trata de nombres, primero puede seleccionar la primera letra y luego tener el subconjunto de elementos que se ajustan. Sería mejor si los elementos se pueden clasificar lógicamente, por ejemplo, personas en una organización, que encajan bien en departamentos, regiones, etc.
    Incluso podrías tener varios niveles de profundidad.

0
Dan Barak