ver sugerencias significan salen qué quienes mensajes las historial eliminar donde direct como busqueda buscador borrar aparecen actividad javascript ajax search dojo

javascript - significan - ¿Cómo se pueden implementar las sugerencias de búsqueda/búsqueda en vivo usando Dojo?



qué significan las sugerencias en el buscador de instagram (1)

Quiero implementar una función de "búsqueda en vivo" o "sugerencias de búsqueda" en una aplicación web que utiliza Dojo Framework. Sería similar a la forma en que las búsquedas de Google y Bing muestran las coincidencias a medida que escribe: cuando escribe en el cuadro de búsqueda, a continuación aparece una lista de posibles coincidencias. Las búsquedas se realizarán en el lado del servidor, y los resultados se enviarán al navegador utilizando AJAX.

¿Alguien sabe de una buena manera de implementar esto usando Dojo?

Aquí hay algunas opciones posibles:

  • El widget integrado dijit.form.ComboBox
    Esto tiene una funcionalidad muy similar, pero solo he visto su uso con conjuntos de datos limitados. Los ejemplos siempre usan listas pequeñas (como los 50 estados en EE. UU.) Y precargan todo el conjunto de datos para el filtrado del lado del cliente. Sin embargo, supongo que podría conectarlo a dojox.data.JsonQueryRestStore para buscar en el servidor. ¿Alguien puede confirmar si funciona?

  • QueryBox http://marumushi.com/code/querybox/
    Esta implementación principalmente hace el trabajo, pero tiene algunos errores menores y no parece que se mantenga. Tendría que hacer algunas correcciones de errores en el código antes de usarlo.

  • Medryx http://blog.medryx.org/2008/09/10/dijitsearch-part-2/
    Esto también parece que hace el trabajo, pero se describe como código de ''nivel alfa'' y el enlace al código parece estar roto ...

Probablemente podría hacer uno de los trabajos anteriores, pero me gustaría saber si hay mejores alternativas.


Lo implementé hace 5 años cuando Dojo estaba en 0.2:

Si bien el código es antiguo, es trivial y, con suerte, te dará ideas sobre cómo atacarlo. El boceto aproximado:

  • Adjunte un controlador de eventos a su cuadro de entrada, que se desencadena en los cambios: use "onkeyup" para detectar un cambio en el cuadro de entrada.
  • Espere hasta que el usuario haya dejado de escribir configurando un temporizador en su controlador de eventos, si aún no está configurado. 200-500ms son buenos tiempos de espera.
    • El tiempo de espera juega un doble papel:
      • Disminuye nuestras solicitudes a un servidor para evitar la sobrecarga.
      • Juega en nuestra percepción del tiempo y nuestros hábitos de mecanografía.
  • Si nuestro tiempo de espera se ha agotado, y no esperamos un servidor ⇒ envíe al servidor una cadena que tenemos hasta ahora.
  • Si todavía estamos esperando un servidor, cancele la solicitud y vuelva a preguntar.
    • Esta parte es específica de la aplicación: no queremos sobrecargar un servidor, y algunas veces un servidor no puede manejar bien las conexiones rotas.
    • En el ejemplo, no cancelo la llamada XHR, pero la espero para terminar primero antes de enviar una nueva solicitud.
  • El servidor responde con resultados relevantes, que se muestran rápidamente.

En la publicación del blog lo implementé como un widget. Obviamente, el embalaje exacto depende de usted.