Controllo Combobox basato su jQuery professionale? [chiuso]


86

Esistono controlli Combobox professionali (elenco a discesa con autosuggestione) basati sulla libreria jQuery?

Dovrebbe essere in grado di gestire set di dati di grandi dimensioni e avere alcune opzioni di skin . Anche un elenco di risultati a più colonne sarebbe fantastico. Sto lavorando con ASP.NET, ma non è un problema se dovessi scrivere un wrapper per questo.

testo alternativo

Sto già utilizzando un controllo di terze parti, ma ho riscontrato alcuni problemi di compatibilità tra i controlli di due fornitori. Bene, voglio sbarazzarmi di questo tipo di dipendenze.


sei mai riuscito a trovare una risposta migliore a questa domanda?
Element

Guarda la risposta di GeorgeBarker di seguito.
splattne

La casella combinata di jQuery si chiama "completamento automatico". jqueryui.com/autocomplete/#combobox
Aaron

Risposte:


24

Sfortunatamente, la cosa migliore che ho visto è jquery.combobox , ma non sembra proprio qualcosa che vorrei davvero usare nelle mie applicazioni web. Penso che ci siano alcuni problemi di usabilità con questo controllo, ma come utente non penso di dover iniziare a digitare per far sì che l'elenco a discesa si trasformi in una casella di testo.

Preferisco di gran lunga il Combo Dropdown Box , ma ha ancora alcune funzionalità che vorrei ed è ancora in alpha. L'unico pensiero che non mi piace di questo, a parte il suo essere alpha ... è che una volta digitato nella casella combinata, gli elementi dell'elenco a discesa originale scompaiono. Tuttavia, forse c'è un'impostazione per questo ... o forse potrebbe essere aggiunto abbastanza facilmente.

Queste sono le uniche due opzioni che conosco. Buona fortuna nella vostra ricerca. Mi piacerebbe sapere se ne trovi uno o se la seconda opzione funziona per te.


1
Mi sembra di avere problemi di compatibilità con jquery.combobox e jQuery 1.4.x ... come con la maggior parte dei plugin che non sono stati mantenuti per molto tempo ...
Lukas Eder

3
Il commento al primo collegamento 'nota: al momento il jquery.combobox si comporta come un elenco a tendina e non come una combbox completa. attualmente non accetta l'immissione di testo. " tipo di sconfigge lo scopo IMO ....
Matthew Dresser

1
link morto su sanchezsalvador.com
markashworth

53

Eccone uno che sembra molto promettente. È una vera combinazione: vedi cosa digiti. Ha una caratteristica interessante che non ho visto altrove: i risultati di paginazione.

FlexBox


Seguirò la raccomandazione FlexBox. Ha uno stile molto, umm, flessibile e opzioni di interfaccia utente.
Ben Griswold,

Nuova versione (0.9.3) appena rilasciata. FlexBox ora supporta il filtro JSON lato client.
Noah Heldman

1
imo FlexBox è per alcuni casi eccessivo.
kajo

Sembra che carichi tutti i dati (json) contemporaneamente, quindi potrebbe non essere appropriato se l'origine dati ha molti record
David

Se seleziono già un valore, fai clic sulla freccia per visualizzare solo il valore selezionato, non tutto il valore.
linbo

24

Chiunque cerchi una "casella combinata" jquery sembra essere indirizzato a questa domanda. Il mio post è per le persone che visitano questa pagina per trovare una casella combinata "tradizionale", piuttosto che una risposta alla domanda originale. Le soluzioni di cui sopra si concentrano tutte sull'utilizzo dell'input come mezzo per filtrare e completare automaticamente un valore di selezione esistente. (ottimo per set di dati di grandi dimensioni)

Se stai cercando la tradizionale casella combinata, che è semplicemente "Digita qualcosa o seleziona da questi valori predefiniti" (no non nasconderemo quelli che non corrispondono durante la digitazione), tutto ciò che puoi è necessario fare

<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;" />

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

Dovrebbe essere facile inserirlo in un plugin che converte un tag di selezione esistente, anche se non l'ho ancora visto.

PS: Il problema principale che vedo con "jQuery Editable Combobox" è che rimane un elenco di selezione, e non è affatto ovvio che puoi semplicemente iniziare a digitare qualcosa di nuovo.



15

È ora disponibile un nuovo fork del progetto sexy-combo che sembra promettente: http://code.google.com/p/ufd/


Mi piace che trasformi una selezione in una casella combinata.
beetstra

1
Dopo aver esaminato ogni suggerimento sulla pagina, ho optato per questo. Veloce, semplice, fornisce solo le funzionalità di base che volevo e ha lavorato su un input di selezione esistente
elwyn

Può funzionare anche con Jquery UI Themeroller
codeulike

Questo era il biz per me. Funziona perfettamente su IE7 e IE8, che era un requisito. Ricerca infissa (metà parola), barre di scorrimento per elenchi più lunghi e funziona bene con altri componenti.
Alastair

Questo è di gran lunga il più facile da integrare se il codice esistente utilizza un vecchio menu a discesa html. Ho usato questo.
Max

14

Per set di dati di grandi dimensioni, che ne dici del completamento automatico dell'interfaccia utente di JQuery , che è fondamentalmente la versione "ufficiale" del plug-in di completamento automatico di Jorn Zaeferrer ?

Ho anche scritto un plug-in combobox JQuery diretto che ha ottenuto un feedback abbastanza buono dai suoi utenti. Tuttavia, non è esplicitamente pensato per set di dati di grandi dimensioni; Immagino che se vuoi qualcosa che elimini l'elenco in base a ciò che l'utente digita, stai meglio con il plug-in di completamento automatico di Jorn.


Il plug-in Autocomplete di Jorn Zaeferrer è semplice e fantastico
Jake Wilson



7

Un componente ComboBox / Autocomplete dell'interfaccia utente jQuery ufficiale è in fase di realizzazione ... (precedentemente in beta per jQuery UI 1.5.x), vedere jQuery UI Wiki

AGGIORNARE:

La funzionalità di completamento automatico è ora una funzionalità principale dell'interfaccia utente di jQuery, vedere la documentazione .


Questo è ora disponibile con jQuery 1.8. Lo sto usando con successo, è stato un widget ben progettato.
Boldewyn

Ragazzi, sperimentate l'effetto post? Quando faccio clic sulla freccia per attivare o disattivare l'elenco, la mia pagina viene pubblicata e ottengo un aggiornamento della pagina ...
senso

7
una casella combinata non è la stessa del completamento automatico
Neil McGuigan

5

Se non hai bisogno di più colonne, anche scelto è un'altra buona scelta. Licenza MIT


+1 per scelto. Sembra fantastico e non abbiamo dovuto apportare alcuna modifica ai menu a discesa esistenti con i dati provenienti da un ObjectDatasource. Funziona e basta!
Matt


3

Sto cercando lo stesso. Quello che mi è piaciuto di più fino ad ora è questo per ExtJs, tranne per il fatto che non l'ho testato con elenchi di grandi dimensioni: www.sencha.com/deploy/dev/examples/form/combos.html

Eccone un altro davvero (!) Veloce: http://jsearchdropdown.sourceforge.net/

Ad esempio, SexyCombo funziona in modo fantastico ma è un modo per rallentare per elenchi più lunghi. L'UFD folk di SexyCombo è molto più veloce, ma il tempo di inizializzazione è ancora piuttosto lento per elenchi davvero enormi. Inoltre a volte ne ricevo un po '! "lampeggiante". Ma immagino che ci saranno alcuni aggiornamenti nel prossimo futuro.


ExtJs funziona anche molto bene con elenchi grandi (o enormi) perché supporta il paging e puoi interrogare i valori localmente o decidere di inviare la query al server e fornire un altro pezzo di risultati. Il problema con ExtJs è la sua ripida curva di apprendimento.
stivlo

3

Sexy-Combo è stato deprecato. Ulteriori sviluppi esistono nel progetto Discendenza filtro veloce discreto. Sembra promettente, poiché ho requisiti simili.

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


Anche se carino, sembra che non funzioni con jquery> 1.6. Alla ricerca di altre opzioni.
dan radu




2

Ho avuto lo stesso problema, quindi ho finito per crearne uno mio.

Ha un sistema di modelli integrato, quindi puoi far sembrare i risultati come vuoi. Funziona su tutti i principali browser e accetta array e oggetti json. http://code.google.com/p/custom-combobox/



2

Ho provato http://jqueryui.com/demos/autocomplete/#combobox e i problemi affrontati sono stati:

  • Rendering cross browser
  • Impossibilità di inviare un valore personalizzato

Di conseguenza l'ho ottimizzato un po 'e ha funzionato bene per me in ASP.NET MVC. La mia versione di CSS e script widget può essere trovata qui http://saplin.blogspot.com/2011/12/html-combobox-control-and-aspnet-mvc.html

È presente anche un esempio sull'associazione del modello MVC al valore personalizzato.





Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.