javascript selected - ¿Combobox basado en jQuery profesional?




value get (19)

Otro buen plugin es Sexy Combo

¿Hay algún control de cuadro combinado profesional (lista desplegable con autosugestión) basado en la biblioteca jQuery?

Debe ser capaz de manejar grandes conjuntos de datos y tener algunas opciones de diseño . Una lista de resultados de múltiples columnas sería genial también. Estoy trabajando con ASP.NET, pero no es un problema si tengo que escribir un contenedor para ello.

Ya estoy usando un control de terceros, pero encontré algunos problemas de compatibilidad entre los controles de dos proveedores. Bueno, quiero deshacerme de este tipo de dependencias.


Cualquiera que busque un "cuadro combinado" de jquery parece estar dirigido a esta pregunta. Mi publicación es para las personas que acceden a esta página para encontrar un cuadro combinado "tradicional", en lugar de una respuesta a la pregunta original. Todas las soluciones anteriores se enfocan en usar la entrada como un medio para filtrar y autocompletar a un valor de selección existente. (ideal para grandes conjuntos de datos)

Si está buscando el cuadro combinado tradicional, que es simplemente "Escriba algo o seleccione entre estos valores predefinidos" (no, no vamos a ocultar los que no coinciden mientras está escribiendo), todo lo que pueda necesito hacer es

<select id="combo4" style="width: 200px;"
            onchange="$('input#text4').val($(this).val());">
    <option>option 1</option>
    <option>option 2</option>
    <option>option 3</option>
</select>
<input id="text4"
       style="margin-left: -203px; width: 180px; height: 1.2em; border: 0;" />

Ver http://bit.wisestamp.com/uncategorized/htmljquery-editable-combo-2/

Debería ser fácil incluir esto en un complemento que convierta una etiqueta de selección existente, aunque todavía no lo he visto.

PD: El principal problema que veo con "JQuery Editable Combobox" es que sigue siendo una lista de selección, y no es nada obvio que simplemente comiences a escribir algo nuevo.


Desafortunadamente, lo mejor que he visto es jquery.combobox , pero realmente no parece algo que realmente quisiera usar en mis aplicaciones web. Creo que hay algunos problemas de usabilidad con este control, pero como usuario no creo que sepa comenzar a escribir para que la lista desplegable se convierta en un cuadro de texto.

Prefiero el cuadro desplegable combinado , pero todavía tiene algunas características que me gustaría tener y todavía está en alfa. Lo único que no me gusta de esto aparte de que es alfa ... es que una vez que escribo en el cuadro combinado, desaparecen los elementos originales de la lista desplegable. Sin embargo, tal vez haya una configuración para esto ... o tal vez podría agregarse con bastante facilidad.

Esas son las únicas dos opciones que conozco. Buena suerte en tu búsqueda. Me encantaría saber si encuentras uno o si la segunda opción funciona para ti.


Sexy-Combo ha quedado en desuso. Existe un mayor desarrollo en el proyecto Desarme de filtro rápido discreto. Parece prometedor, ya que tengo requisitos similares.

https://code.google.com/p/ufd/


Aquí hay uno realmente genial: http://www.xnodesystems.com/ El campo de lista dinámica no solo tiene la capacidad de autocompletar, sino que también puede hacer la validación.


Si no necesita columna múltiple, la chosen es otra buena opción. Licencia MIT



Para grandes conjuntos de datos, ¿qué hay de JQuery UI Autocompletar , que es básicamente la versión "oficial" del complemento Autocompletar de Jorn Zaeferrer?

También escribí un complemento de combobox JQuery directo que obtuvo muy buenos comentarios de sus usuarios. Sin embargo, explícitamente no es para grandes conjuntos de datos; Me imagino que si quieres algo que limpie la lista según lo que escriba el usuario, estarás mejor con el complemento de autocompletado de Jorn.


Me gusta select2 , es rico en funciones y agradable y activo. Particularmente como la característica de búsqueda diacritic .




Se está preparando un componente jQuery UI ComboBox / Autocomplete ... (anteriormente en versión beta para jQuery UI 1.5.x), consulte jQuery UI Wiki

ACTUALIZAR:

La funcionalidad de autocompletar ahora es una función central de jQuery UI, ver documentos .


¿Por qué no pruebas http://jqueryajax.codeplex.com/ . Es una colección de controles ASP.NET que también contiene menú desplegable de múltiples columnas.



Esto también es prometedor:

Cuadro combinado desplegable JQuery en simpletutorials.com


Estoy buscando lo mismo. El que más me gustó hasta ahora es este para ExtJs, excepto que no lo he probado con listas grandes: www.sencha.com/deploy/dev/examples/form/combos.html

Aquí hay otro realmente (!) Rápido: http://jsearchdropdown.sourceforge.net/

Por ejemplo, el SexyCombo funciona bastante bien pero es muy lento para las listas más largas. El UFD popular de SexyCombo es mucho más rápido, pero el tiempo de inicialización sigue siendo bastante lento para listas realmente enormes. Además, a veces me pongo un poco! "brillante". Pero creo que habrá algunas actualizaciones en el futuro cercano.




Al probar un elemento con :hidden selector :hidden en jQuery, debe considerarse que un elemento posicionado absoluto puede reconocerse como oculto aunque sus elementos secundarios estén visibles .

Esto parece algo contraintuitivo en primer lugar, aunque al observar más de cerca la documentación de jQuery, se obtiene la información relevante:

Los elementos pueden considerarse ocultos por varias razones: [...] su ancho y alto se establecen explícitamente en 0. [...]

Así que esto realmente tiene sentido en relación con el modelo de caja y el estilo computado para el elemento. Incluso si el ancho y el alto no están establecidos explícitamente en 0, pueden establecerse implícitamente .

Echa un vistazo al siguiente ejemplo:

console.log($('.foo').is(':hidden')); // true
console.log($('.bar').is(':hidden')); // false
.foo {
  position: absolute;
  left: 10px;
  top: 10px;
  background: #ff0000;
}

.bar {
  position: absolute;
  left: 10px;
  top: 10px;
  width: 20px;
  height: 20px;
  background: #0000ff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foo">
  <div class="bar"></div>
</div>

ACTUALIZACIÓN PARA JQUERY 3.x:

Con jQuery 3 el comportamiento descrito cambiará! Los elementos se considerarán visibles si tienen cuadros de diseño, incluidos los de ancho y / o altura cero.

JSFiddle con jQuery 3.0.0-alpha1:

http://jsfiddle.net/pM2q3/7/

El mismo JS tendrá entonces esta salida:

console.log($('.foo').is(':hidden')); // false
console.log($('.bar').is(':hidden')); // false




javascript jquery combobox controls