Профессиональный элемент управления Combobox на основе jQuery? [закрыто]


86

Существуют ли какие-либо профессиональные элементы управления Combobox (раскрывающийся список с автозаполнением) на основе библиотеки jQuery?

Он должен уметь обрабатывать большие наборы данных и иметь некоторые параметры скинов . Список результатов из нескольких столбцов тоже подойдет. Я работаю с ASP.NET, но это не проблема, если бы мне пришлось написать для него оболочку.

альтернативный текст

Я уже использую сторонний элемент управления, но я столкнулся с некоторыми проблемами совместимости между элементами управления двух поставщиков. Что ж, я хочу избавиться от такого рода зависимостей.


Удалось ли вам найти лучший ответ на этот вопрос?
— Element

Посмотрите на ответ Джорджа Баркера ниже.
— splattne,

Поле со списком jQuery называется «автозаполнение». jqueryui.com/autocomplete/#combobox
— Аарон

Ответы:


24

К сожалению, лучшее, что я видел, - это jquery.combobox , но на самом деле он не похож на то, что я действительно хотел бы использовать в своих веб-приложениях. Я думаю, что с этим элементом управления есть некоторые проблемы с удобством использования, но, как пользователь, я не думаю, что мне нужно было бы начать вводить текст, чтобы раскрывающийся список превратился в текстовое поле.

Я предпочитаю выпадающий список со списком , но в нем все еще есть некоторые функции, которые мне нужны, и он все еще находится в стадии альфа. Единственное, что мне не нравится, кроме того, что это альфа ... это то, что как только я набираю поле со списком, исходные элементы раскрывающегося списка исчезают. Однако, возможно, для этого есть настройка ... или, может быть, ее можно было бы довольно легко добавить.

Это единственные два варианта, о которых я знаю. Удачи в твоем поиске. Я хотел бы услышать, найдете ли вы один или вам подойдет второй вариант.


1
Похоже, у меня проблемы с совместимостью с jquery.combobox и jQuery 1.4.x ... как и с большинством плагинов, которые не поддерживались долгое время ...
— Лукас Эдер

3
Комментарий к первой ссылке : на данный момент jquery.combobox ведет себя как выпадающий список, а не как полный набор. в настоящее время он не принимает ввод текста. ' вид поражения цели ИМО ....
— Мэтью Дрессер

1
мертвая ссылка на sanchezsalvador.com
— markashworth

53

Вот тот, который выглядит очень многообещающим. Это настоящая комбинация - вы видите, что печатаете. Имеет интересную функцию, которую я нигде не видел: результаты подкачки.

FlexBox


Я поддержу рекомендацию FlexBox. У него очень, ммм, гибкий стиль и параметры пользовательского интерфейса.
— Ben Griswold

Вышла новая версия (0.9.3). FlexBox теперь поддерживает фильтрацию JSON на стороне клиента.
— Ной Хелдман,

1
imo FlexBox для некоторых случаев является излишним.
— kajo

Кажется, что загружает все данные (json) сразу, поэтому может быть неприемлемым, если источник данных имеет много записей
— Дэвид

Если я уже выбрал одно значение, щелкните стрелку, и она покажет только выбранное значение, а не все значение.
— Линбо

24

Любой, кто ищет "поле со списком" jquery, похоже, направлен на этот вопрос. Мой пост предназначен для людей, приходящих на эту страницу, чтобы найти «традиционное» поле со списком, а не ответ на исходный вопрос. Все вышеперечисленные решения сосредоточены на использовании ввода как средства фильтрации и автозаполнения для существующего значения выбора. (отлично подходит для больших наборов данных)

Если вы ищете традиционное поле со списком, которое представляет собой просто «Введите что-нибудь или выберите из этих предопределенных значений» (нет, мы не будем скрывать те, которые не совпадают, пока вы печатаете), все, что вы можете нужно сделать это

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

См. Http://bit.wisestamp.com/uncategorized/htmljquery-editable-combo-2/

Должно быть легко превратить это в плагин, который преобразует существующий тег выбора, хотя я еще не видел, чтобы это было сделано.

PS: Основная проблема, которую я вижу с "jQuery Editable Combobox", заключается в том, что он остается списком выбора, и совсем не очевидно, что вы можете просто начать вводить что-то новое.



15

Вышел новый форк проекта sexy-combo, который выглядит многообещающим: http://code.google.com/p/ufd/


Мне нравится, что он превращает выделение в поле со списком.
— beetstra

1
Изучив все предложения на странице, я остановился на этом. Быстро, просто, предоставляет только базовую функциональность, которую я хотел, и работал над существующим входом select
— elwyn

Может также работать с JQuery UI Themeroller
— codeulike

Этот был для меня бизнесом. Без проблем работает в IE7 и IE8, что было обязательным требованием. Поиск по инфиксу (в середине слова), полосы прокрутки для более длинных списков и удобная работа с другими компонентами.
— Alastair

Это, безусловно, самый простой способ интеграции, если в вашем существующем коде используется старый раскрывающийся список HTML. Я использовал этот.
— Макс

14

Для больших наборов данных как насчет JQuery UI Autocomplete , который по сути является «официальной» версией плагина Jorn Zaeferrer Autocomplete ?

Я также написал простой плагин JQuery combobox, который получил довольно хорошие отзывы от пользователей. Однако это явно не предназначено для больших наборов данных; Я полагаю, что если вам нужно что-то, что сокращает список в зависимости от того, что вводит пользователь, вам лучше использовать плагин автозаполнения Йорна.


Плагин Jorn Zaeferrer Autocomplete прост и классен
— Джейк Уилсон


7

Это тоже многообещающе:

Выпадающее поле со списком JQuery на simpletutorials.com


Выглядит неплохо, но не поддерживает другое имя и значение, как вы можете с помощью select <options>
— BT

1
Также не поддерживает два поля со списком на одной странице.
— Тим Сэйлор

7

Официальный компонент jQuery UI ComboBox / Autocomplete находится в процессе создания ... (ранее был в бета-версии для jQuery UI 1.5.x), см. JQuery UI Wiki

ОБНОВИТЬ:

Функция автозаполнения теперь является основной функцией пользовательского интерфейса jQuery, см. Документацию .


Теперь это работает с jQuery 1.8. Пользуюсь довольно успешно, виджет хорошо продуманный.
— Boldewyn

Ребята, вы испытываете пост-эффект? Когда я щелкаю стрелку, чтобы переключить список, моя страница публикуется, и я получаю обновление страницы ...
— часовой стрелке

7
поле со списком - это не то же самое, что автозаполнение
— Нил МакГиган

5

Если вам не нужна многоколоночная колонка, выберите еще один хороший выбор. Лицензия MIT


+1 для избранных. Выглядит великолепно, и нам не пришлось вносить какие-либо изменения в существующие раскрывающиеся списки с данными, поступающими из ObjectDatasource. Просто работает!
— Мэтт


3

Я ищу то же самое. До сих пор мне больше всего нравился этот для ExtJ, за исключением того, что я не тестировал его с большими списками: www.sencha.com/deploy/dev/examples/form/combos.html

Вот еще один действительно (!) Быстрый: http://jsearchdropdown.sourceforge.net/

Например, SexyCombo работает фантастически, но для длинных списков может замедлить работу. Народный UFD SexyCombo работает намного быстрее, но время инициализации все еще довольно медленное для действительно огромных списков. Кроме того, иногда я получаю немного! «мигает». Но я думаю, что в ближайшее время будут некоторые обновления.


ExtJs также очень хорошо работает с большими (или огромными) списками, потому что он поддерживает разбиение на страницы, и вы можете либо запросить значения локально, либо решить отправить запрос обратно на сервер и предоставить другой фрагмент результатов. Проблема с ExtJ в том, что это крутая кривая обучения.
— Стивло 09

3

Sexy-Combo устарел. Дальнейшее развитие существует в проекте раскрывающегося меню «Ненавязчивый быстрый фильтр». Выглядит многообещающе, так как у меня похожие требования.

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


Хотя это приятно, похоже, что он не работает с jquery> 1.6. Ищу другие варианты.
— дан раду


2

Почему бы вам не попробовать http://jqueryajax.codeplex.com/ . Это набор элементов управления ASP.NET, который также содержит раскрывающийся список с несколькими столбцами.


2

У Activewidgets очень красивый вид. Не знаю, насколько хорошо он работает с большими наборами данных. http://www.activewidgets.com/ui.combo/


2

У меня была такая же проблема, поэтому я решил сделать свою.

В него встроена система шаблонов, поэтому вы можете сделать результаты такими, как хотите. Работает во всех основных браузерах и принимает массивы и объекты json. http://code.google.com/p/custom-combobox/


2

Вот действительно классный вариант: http://www.xnodesystems.com/ Поле динамического списка не только имеет возможность автозаполнения, но также может выполнять проверку.


2

Я пробовал http://jqueryui.com/demos/autocomplete/#combobox, и возникли следующие проблемы:

  • Кроссбраузерный рендеринг
  • Невозможность отправить пользовательское значение

В результате я немного подправил его, и он отлично работал в ASP.NET MVC. Моя версия CSS и скрипта виджетов можно найти здесь http://saplin.blogspot.com/2011/12/html-combobox-control-and-aspnet-mvc.html

Также есть образец привязки модели MVC к пользовательскому значению.





Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.