Contrôle Combobox basé sur jQuery professionnel? [fermé]


86

Existe-t-il des contrôles Combobox professionnels (liste déroulante avec autosuggestion) basés sur la bibliothèque jQuery?

Il devrait être capable de gérer de grands ensembles de données et avoir quelques options de skinning . Une liste de résultats multi-colonnes serait également très bien. Je travaille avec ASP.NET, mais ce n'est pas un problème si je devais écrire un wrapper pour cela.

texte alternatif

J'utilise déjà un contrôle tiers, mais j'ai rencontré des problèmes de compatibilité entre les contrôles de deux fournisseurs. Eh bien, je veux me débarrasser de ce genre de dépendances.


avez-vous jamais pu trouver une meilleure réponse à cette question?
Element

Regardez la réponse de GeorgeBarker ci-dessous.
splattne

La zone de liste déroulante de jQuery est appelée «saisie semi-automatique». jqueryui.com/autocomplete/#combobox
Aaron

Réponses:


24

Malheureusement, la meilleure chose que j'ai vue est la jquery.combobox , mais elle ne ressemble pas vraiment à quelque chose que je voudrais vraiment utiliser dans mes applications Web. Je pense qu'il y a des problèmes d'utilisabilité avec ce contrôle, mais en tant qu'utilisateur, je ne pense pas que je saurais commencer à taper pour que la liste déroulante se transforme en une zone de texte.

Je préfère de loin la liste déroulante combinée , mais elle a toujours certaines fonctionnalités que je voudrais et elle est toujours en alpha. La seule chose que je n'aime pas à propos de cela, à part le fait qu'il est alpha ... est qu'une fois que je tape dans la zone de liste déroulante, les éléments de la liste déroulante d'origine disparaissent. Cependant, il y a peut-être un paramètre pour cela ... ou peut-être qu'il pourrait être ajouté assez facilement.

Ce sont les deux seules options que je connaisse. Bonne chance dans votre recherche. J'aimerais savoir si vous en trouvez un ou si la deuxième option vous convient.


1
Il me semble avoir des problèmes de compatibilité avec jquery.combobox et jQuery 1.4.x ... comme avec la plupart des plugins qui n'ont pas été maintenus depuis longtemps ...
Lukas Eder

3
Le commentaire sur le premier lien 'remarque: pour le moment, la jquery.combobox se comporte comme une liste déroulante et non comme une combbox complète. il n'accepte pas actuellement la saisie de texte. ' sorte de vaincre l'objectif IMO ....
Matthew Dresser

1
lien mort sur sanchezsalvador.com
markashworth

53

En voici un qui semble très prometteur. C'est un vrai combo - vous voyez ce que vous tapez. A une fonctionnalité intéressante que je n'ai pas vue ailleurs: les résultats de pagination.

FlexBox


Je soutiendrai la recommandation FlexBox. Il a un style très flexible et des options d'interface utilisateur.
Ben Griswold

La nouvelle version (0.9.3) vient de sortir. FlexBox prend désormais en charge le filtrage JSON côté client.
Noah Heldman

1
imo FlexBox est dans certains cas exagéré.
kajo le

Semble charger toutes les données (json) à la fois, il peut donc ne pas être approprié si la source de données contient beaucoup d'enregistrements
David

Si je sélectionne déjà une valeur, cliquez sur la flèche pour afficher uniquement la valeur sélectionnée, pas toute la valeur.
linbo

24

Quiconque cherche une "combo box" jquery semble être dirigé vers cette question. Mon message est destiné aux personnes qui viennent sur cette page pour trouver une liste déroulante "traditionnelle", plutôt qu'une réponse à la question d'origine. Les solutions ci-dessus se concentrent toutes sur l'utilisation de l'entrée comme moyen de filtrer et de compléter automatiquement une valeur de sélection existante. (idéal pour les grands ensembles de données)

Si vous recherchez la zone de liste déroulante traditionnelle, qui est simplement "Tapez quelque chose ou sélectionnez parmi ces valeurs prédéfinies" (non, nous ne cacherons pas celles qui ne correspondent pas pendant que vous tapez), tout ce que vous pouvez besoin de faire est

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

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

Cela devrait être facile à intégrer dans un plugin qui convertit une balise de sélection existante, même si je n'ai pas encore vu cela fait.

PS: Le principal problème que je vois avec "jQuery Editable Combobox" est qu'il reste une liste de sélection, et il n'est pas du tout évident que vous puissiez simplement commencer à taper quelque chose de nouveau.



15

Un nouveau fork du projet sexy-combo est maintenant sorti et semble prometteur: http://code.google.com/p/ufd/


J'aime le fait qu'il transforme un select en combobox.
beetstra

1
Après avoir examiné chaque suggestion sur la page, je me suis contenté de celle-ci. Rapide, simple, fournit juste la fonctionnalité de base que je voulais et a travaillé sur une entrée de sélection existante
elwyn

Peut également fonctionner avec Jquery UI Themeroller
codeulike

Celui-ci était le biz pour moi. Fonctionne parfaitement sur IE7 et IE8, ce qui était une exigence. Recherche d'infixe (mi-mot), barres de défilement pour des listes plus longues et fonctionne bien avec d'autres composants.
Alastair

C'est de loin le plus simple à intégrer si votre code existant utilise une ancienne liste déroulante html. J'ai utilisé celui-ci.
Max

14

Pour les grands ensembles de données, qu'en est-il de JQuery UI Autocomplete , qui est essentiellement la version "officielle" du plugin Autocomplete de Jorn Zaeferrer ?

J'ai également écrit un plugin JQuery combobox simple qui a obtenu de très bons commentaires de ses utilisateurs. Cependant, il n'est explicitement pas destiné aux grands ensembles de données; Je suppose que si vous voulez quelque chose qui élague la liste en fonction de ce que l'utilisateur tape, vous feriez mieux d'utiliser le plugin de saisie semi-automatique de Jorn.


Le plugin Autocomplete de Jorn Zaeferrer est simple et génial
Jake Wilson


7

C'est également prometteur:

Boîte de liste déroulante JQuery sur simpletutorials.com


Cela a l'air plutôt sympa, mais ne prend pas en charge le fait d'avoir un nom et une valeur différents comme vous pouvez le faire avec sélectionnez <options>
BT

1
Ne prend pas non plus en charge deux zones de liste déroulante sur une page.
Tim Saylor

7

Un composant officiel jQuery UI ComboBox / Autocomplete est en préparation ... (précédemment en version bêta pour jQuery UI 1.5.x), voir jQuery UI Wiki

MISE À JOUR:

La fonctionnalité de saisie semi-automatique est désormais une fonctionnalité principale de l'interface utilisateur jQuery, voir la documentation .


Ceci est maintenant en ligne avec jQuery 1.8. Je l'utilise avec beaucoup de succès, c'est un widget bien conçu.
Boldewyn

Est-ce que vous ressentez l'effet post? Lorsque je clique sur la flèche pour basculer la liste, ma page est publiée et je reçois une actualisation de la page ...
dans le sens des aiguilles d'une

7
une liste déroulante n'est pas la même chose que la saisie semi
Neil McGuigan

5

Si vous n'avez pas besoin de plusieurs colonnes, choisissez un autre bon choix. Licence MIT


+1 pour choisi. Cela a l'air génial et nous n'avons pas eu à apporter de modifications aux listes déroulantes existantes avec des données provenant d'un ObjectDatasource. Cela fonctionne juste!
Matt


3

Je cherche la même chose. Celui que j'ai le plus aimé jusqu'à présent est celui-ci pour ExtJs - sauf que je ne l'ai pas testé avec de grandes listes: www.sencha.com/deploy/dev/examples/form/combos.html

En voici un autre vraiment (!) Rapide: http://jsearchdropdown.sourceforge.net/

Par exemple, le SexyCombo fonctionne assez bien mais est un moyen de ralentir pour des listes plus longues. L'UFD folk de SexyCombo est beaucoup plus rapide, mais le temps d'initialisation est encore assez lent pour des listes vraiment énormes. D'ailleurs j'en reçois parfois un peu! "clignotant". Mais je suppose qu'il y aura des mises à jour dans un proche avenir.


ExtJs fonctionne également très bien avec des listes volumineuses (ou énormes) car il prend en charge la pagination et vous pouvez soit interroger les valeurs localement, soit décider de renvoyer la requête au serveur et de fournir un autre segment de résultats. Le problème avec ExtJs est sa courbe d'apprentissage abrupte.
stivlo

3

Sexy-Combo est obsolète. D'autres développements existent dans le projet Unobtrusive Fast-Filter Dropdown. Cela semble prometteur, car j'ai des exigences similaires.

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


Bien que sympa, il semble que cela ne fonctionne pas avec jquery> 1.6. Recherche d'autres options.
dan radu


2

Pourquoi n'essayez-vous pas http://jqueryajax.codeplex.com/ . Il s'agit d'une collection de contrôles ASP.NET qui contient également une liste déroulante multicolonne.



2

J'ai eu le même problème, alors j'ai fini par créer le mien.

Il a un système de modèle intégré, vous pouvez donc donner aux résultats ce que vous voulez. Fonctionne sur tous les principaux navigateurs et accepte les tableaux et les objets json. http://code.google.com/p/custom-combobox/



2

J'ai essayé http://jqueryui.com/demos/autocomplete/#combobox et les problèmes rencontrés étaient:

  • Rendu multi-navigateurs
  • Incapacité de soumettre une valeur personnalisée

En conséquence, je l'ai légèrement modifié et cela a bien fonctionné pour moi dans ASP.NET MVC. Ma version du CSS et du script de widget peut être trouvée ici http://saplin.blogspot.com/2011/12/html-combobox-control-and-aspnet-mvc.html

Un exemple de liaison du modèle MVC à une valeur personnalisée est également disponible.





En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.