Chosen: Obtener desde una fuente de datos remota

Esto es un poco mejor que jquery auto complete, ¿no? Me gustaría ver fuentes de datos remotas eventualmente (la capacidad de proporcionar una devolución de llamada para los resultados de búsqueda)

Tercero esta solicitud. Esto sería muy útil para tener la capacidad de especificar una fuente remota al igual que la función de autocompletar jQuery UI.

O tal vez incluso mejor: Incluir elegido en jQuery UI. :)

+1

más específicamente, mi +1 es por la idea de usar una fuente de datos remota con entrada de texto libre (por ejemplo, usar llamadas ajax para ayudar en el etiquetado)

Lo siento, no fui lo suficientemente claro, pero la integración de "fuente de datos remota" es lo que quise decir originalmente, gracias por señalarlo. Por supuesto, este complemento es mucho mejor que la función jQuery Auto Complete. Como comentó daFish, me encantaría ver esto como parte de jQuery UI.

+1 para soporte de fuentes de datos remotas

no lo entiendo Elegido se trata de una mejor usabilidad y belleza en los elementos SELECT , no de autocompletar o de obtener datos remotos. Si desea datos remotos, recójalos y colóquelos en el DOM antes de la llamada Elegida...

@juanghurtado : si tengo un cuadro de selección múltiple que contiene 300K elementos, realmente no puedo escribirlo en html por completo. Chosen proporciona la interfaz perfecta para buscar y seleccionar. hay muchas otras bibliotecas que proporcionan esta funcionalidad, es decir, [1], [2] y muchas más. De todos estos, Chosen funciona mejor, pero no admite colecciones muy grandes, que es lo que agregaría el soporte de fuente de datos remota. Además, si Chosen admitiera esto, significaría tener que personalizar y mantener actualizado un complemento en lugar de dos.

[1] http://loopj.com/jquery-tokeninput/
[2] http://wharsojo.wordpress.com/2008/02/18/jquery-facebook-autocomplete/

Bueno, si tiene 300k artículos en su artículo de SELECT , (en mi humilde opinión) está haciendo algo mal... Hay muchas opciones para manejar esa interfaz de una mejor manera.

Chosen podría hacer muchas cosas... Como navajas, podría hacer muchas cosas (fuentes de datos remotas, asociación de imágenes a elementos, filtrado personalizado, consultas AJAX...) y dejar de ser la herramienta perfecta para una sola (mejor interfaz para SELECT tradicional

El 10/08/2011, a las 22:56, ivaynberg escribió:

@juanghurtado : si tengo un cuadro de selección múltiple que contiene 300K elementos, realmente no puedo escribirlo en html por completo. Chosen proporciona la interfaz perfecta para buscar y seleccionar. hay muchas otras bibliotecas que proporcionan esta funcionalidad, es decir, [1], [2] y muchas más. De todos estos, Chosen funciona mejor, pero no admite colecciones muy grandes, que es lo que agregaría el soporte de fuente de datos remota. Además, si Chosen admitiera esto, significaría tener que personalizar y mantener actualizado un complemento en lugar de dos.

[1] http://loopj.com/jquery-tokeninput/
[2] http://wharsojo.wordpress.com/2008/02/18/jquery-facebook-autocomplete/

Responda a este correo electrónico directamente o véalo en GitHub:
https://github.com/harvesthq/chosen/issues/79#issuecomment-1776643

realmente no puedo discutir con eso...

Quiero obtener datos remotos cuando busco entre los elegidos, como el complemento jquery autocompletar, por favor ayúdenme

+1 para tener soporte para datos remotos.

cualquier aspecto de la interfaz de usuario es agradable, pero se tienen algunos problemas, como no admitir datos remotos.

Creo que esto es factible, pero no tan fácil como uno podría pensar. Dado que esto es github y código abierto, veamos un poco de código.

@juanghurtado También creo que podemos hacer esto sin inflar la funcionalidad existente, tanto jquery como prototipo nos brindan todo lo que necesitamos para fuentes de datos remotas.

Results_search() parece activarse durante las pulsaciones de teclas; ahí es donde anularía el comportamiento predeterminado elegido. Necesito profundizar un poco más, pero parece que si podemos imitar winnow_results() y agregar una forma de mostrar el comportamiento de carga (por ejemplo, winnow_loading_results()), esto podría funcionar bien.

Otra función a tener en cuenta es winnow_results_clear();

La parte difícil es descubrir cómo integrar esto sin problemas en Chosen. ¿Debería estar en las opciones? ¿Debería ser solo una subclase? ¿Y es esto algo que los desarrolladores centrales dejarían entrar en el proyecto maestro?

En realidad, deberíamos cerrar este problema, se está trabajando mucho en el n. ° 162, que parece ser todo lo que querríamos.

Solo pensé en agregar que en la era actual esta funcionalidad es imprescindible y realmente espero que se implemente pronto. En cualquier otra forma elegida es perfecta. :)

¿Qué pasó con ese problema de obtención de datos remotos?

Es hora de que @pfiller se una a la conversación, supongo.

+1 me encantaria ver esto

Estoy cargando los valores remotos a la vez cuando se sirve la página, por lo que si no puedo actualizar o obtener nuevos datos, si al menos pudiera agregar nuevas opciones a la selección, podría mantener el lado del cliente hasta que se actualice la página. Así que +1 a la obtención remota y/o +1 a la capacidad de agregar nuevas opciones. Espero que esto tenga sentido...

+1 para solicitud de jaloka

yo tengo una tabla con 17500 registros y cuando cargo la pagina se vuelve lenta y por ultimo se bloque... creo que si se pudiera implementar la forma de ir a buscar coincidecias en la tabla seria lo mejor.

Alguien lo ha implementado: https://github.com/meltingice/ajax-chosen

No soy un gurú de jQuery y en realidad no sé nada al respecto. Así que por favor perdonen mi manera despistada de explicar las cosas. Realmente no puedo encontrar las palabras adecuadas para describir mi problema. Simplemente seguí esa instrucción simple: agregué una clase, puse el script y llamé a la función. Todo funcionó muy bien, excepto la página que no tenía entrada de selección. Y no estoy seguro de que los datos vayan con la ayuda de Ajax. Todo lo que puedo suponer es que los formularios se generan a partir de la tabla de la base de datos MySQL. Las opciones de selección de entrada van desde allí. Al menos se veía como cuando edité la página. Entonces, cuando cargo la página, solo veo la clase 'chzn-select' en mi entrada de selección, lo que significa que el script no funciona en absoluto. Al leer problemas relacionados, entendí que se debe a una fuente de datos remota, pero no entiendo cómo solucionarlo. En realidad, no entiendo de qué están hablando aquí. Intenté Ajax-elegido proporcionado arriba sin éxito y probé otros 'trucos' mencionados aquí. ¿Alguien puede explicar con palabras simples si es posible hacer algo en mi caso o no?

Estoy usando jQuery 1.4.2, probé tanto en Mac OS como en Windows. Puede consultarlo aquí: http://94.125.8.168/eng/ (haga clic en la pestaña Buscar o Horario en el bloque central llamado Información de vuelo). Selecciona el destino, el número de vuelo y el aeropuerto que se supone que se han elegido.

@ffiona Debe envolver su llamada Elegida en una función preparada para jQuery .

$(document).ready(function() {
  $(".chzn-select").chosen();
});

Intente mantener las preguntas futuras sobre el tema para un hilo. Si tiene alguna pregunta, le invitamos a abrir un nuevo número.

@pfiller ¿ es esta una función en la que ustedes están/o trabajarán? Probé todos los otros hacks elegidos por ajax pero ninguno de ellos realmente funcionó. Realmente necesito esto porque estoy trabajando en una aplicación de bolsa de valores que el usuario escribe en símbolos de acciones que, como saben, pueden tener decenas de miles de ellos.

@todo parece que mi opción para obtener el autocompletado de ajax de los elegidos será una posibilidad remota y es posible que tenga que buscar alternativas. ¿Alguien puede recomendar alguna otra alternativa a la elegida con esta función?

También creé uno recientemente... https://github.com/ksykulev/chosen-ajax-addition

@ksykulev , ¿tienes una demostración en vivo de esto en alguna parte?

@jaequery
Simplemente hackeó rápidamente un ejemplo http://sykulev.com/ajaxchosen/index.html

Agregué el código debajo de /example en mi repositorio.

@ksykulev : su versión hace un gran trabajo con selecciones individuales, ¡gracias! Por cierto, no funciona con selección múltiple. Puedo echar un vistazo a esto si tengo algo de tiempo libre.

La versión de @meltingice también hace cosas realmente extrañas en la selección múltiple, creo que es porque no usa funciones elegidas en absoluto (por lo que todas las cosas que se resuelven naturalmente en la biblioteca original no están en la versión ajax, por ejemplo, reposicionamiento de entrada y cambiar el tamaño después de enviar los resultados al cliente).

@jbbarth : Sí, tiene razón, no lo he probado con selecciones múltiples, así que solo puedo imaginar que no funciona muy bien. En términos de la integridad de mi biblioteca, definitivamente puedo agregar soporte para estos. Me pondré en ello. ¡Gracias!

terminé lanzando mi propia versión con apariencia basada en Chosen.

https://github.com/ivaynberg/select2

admite conjuntos de datos remotos ajax/jsonp y desplazamiento infinito (carga diferida de conjuntos de datos remotos paginados). Sin embargo, aún no hay soporte para selección múltiple.

@ivaynberg Estoy todos los ojos en esto.

Una vez que llegue a la función de parodia con Chosen (específicamente soporte de selección múltiple similar a una etiqueta), definitivamente debería cambiar este hilo.

Me encanta la apariencia de Chosen, pero realmente deja cosas que desear en la implementación.

¡Muy, muy buen trabajo!

@ivaynberg Me di cuenta de que todavía tiene un código elegido que calcula específicamente los anchos de entrada desplegable y de búsqueda.

Es posible que desee comprobar esto: https://github.com/harvesthq/chosen/pull/407

Recientemente actualicé mi versión elegida de ajax para admitir selecciones múltiples. http://sykulev.com/ajaxchosen/index.html

@justindujardin Select2 master ahora tiene paridad de funciones. Echaré un vistazo a las cosas de tamaño en 407, pero deberíamos llevar más discusiones al proyecto de Select2.

Me encanta Select2 y recomiendo a TODOS que se cambien a él. je.

@ProLoser : gracias por eso... exactamente lo que estaba buscando. Parece una opción mucho mejor.

Seleccione2 FTW!

¡Select2 es el camino a seguir!

¿Alguna actualización después de todos estos años?

¿Por qué falta esa función de diablillo?

hmm... eso apesta. Decidí implementar Chosen debido al resaltado de texto, pero no me di cuenta de que AJAX iba a ser tan difícil de agregar. Supongo que debería haber optado por select2 si todo el mundo abandona esto para ir a aquello como una forma de cumplir con los requisitos. :(

Es una gran característica. Muchas bifurcaciones proponen esta función, pero la implementación suele ser caótica. :+1:

Se me ocurrió una solución fácil de parche de mono:

AbstractChosen.prototype.winnow_results = (function(winnow_results) {
  return function() {
    if (this.options.source) {
      return this.options.source.call(this.form_field, this.search_field.val(), (function(_this) {
        return function(results) {
          var id, option, select;
          if (results) {
            select = document.createElement('select');
            select.appendChild(document.createElement('option'));
            for (id in results) {
              if (results.hasOwnProperty(id)) {
                option = document.createElement('option');
                option.value = id;
                option.textContent = results[id];
                select.appendChild(option);
              }
            }
            _this.results_data = SelectParser.select_to_array(select);
          }
          return winnow_results.call(_this);
        };
      })(this));
    } else {
      return winnow_results.call(this);
    }
  };
})(AbstractChosen.prototype.winnow_results);

Puede proporcionar una opción de función de 'fuente' para elegir, que se llamará en la representación de resultados. Tendrá valor de entrada de cadena y argumentos de función de devolución de llamada. La función de devolución de llamada muestra sugerencias. Si los resultados no deberían haber cambiado, entonces debe llamarlo inmediatamente sin argumentos, de lo contrario, puede solicitar resultados y enviarlos a la devolución de llamada cuando los tenga. El objeto de resultados tiene este formato: { value: "label", value2: "label2" } . Aquí hay un ejemplo:

var select = $("#select"),
    value;
select.chosen({
    source: function (val, callback) {
        if (value != val) {
            value = val;
            $.get('/suggestions', { value: value }, callback);
        } else
            callback();
    }
});

Lo que @faucct sugiere parece funcionar. Sin embargo, una nota menor es que si está utilizando la versión jquery, no podrá acceder a AbstractChosen, fuera del alcance elegido, por lo que probablemente desee agregar esos archivos al alcance del interior elegido o tendrá que modificar el archivo js elegido y mueva AbstractChosen y SelectParser al alcance global. Otro problema es que actualiza la lista abierta (div que crea elegido) pero no actualiza el "campo de selección" real, por lo tanto, una opción que seleccionó si no existe en la selección podría arrojar un error. Una cosa a tener en cuenta también es que la cadena que escribió se usa para filtrar los resultados que devuelve también. También funciona cada vez que escribes algo para que tengas el control manualmente para no hacer llamadas.

He encontrado otra extensión es esta: https://github.com/meltingice/ajax-chosen

Funciona bastante bien, pero la versión actual está rota, tienes que hacer algunas modificaciones menores. Debe reemplazar "chzn" con "elegido" ya que la biblioteca elegida ha cambiado sus nombres css internos. El último cambio que debe hacer es activar " elegido: actualizado " en lugar de " listz: actualizado ". En el archivo Léame, le pide que corrija un error en el css, pero ya está corregido en las versiones más nuevas, por lo que no es necesario que lo haga. También puede configurar algunas opciones útiles y, si el usuario continúa escribiendo, el sistema también cancela las llamadas pendientes.

Este fue mi viaje :), espero que ayude.

Resolví este problema creando un complemento que maneja la fuente de datos remota para elegir, espero que todos puedan disfrutarlo

fuente remota elegida (https://github.com/westonganger/chosen-remote-source)

Todo el código es bastante simple con menos de 200 líneas de código.
https://github.com/westonganger/chosen-remote-source/blob/master/src/chosen-remote-source.js

La única parte de Chosen que se requirió parchear fue la siguiente:

// MONKEY PATCH CHOSEN TO NOT CLEAR THE SELECTED RESULTS UPON SEARCHING WITH
chosen_prototype.show_search_field_default = function() {
  if (this.is_multiple && this.choices_count() < 1 && !this.active_field) {
    this.search_field.val(this.default_text);
    return this.search_field.addClass("default");
  } else {
    if(this.default_text === this.search_field.val()){
      this.search_field.val(""); // ORIGINAL LINE, SURROUNDING IF STATEMENT IS CUSTOM
    }

    return this.search_field.removeClass("default");
  }
};
// END CHOSEN PATCH