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

86

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

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

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

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

Splattne
источник
Удалось ли вам найти лучший ответ на этот вопрос?
Element
Посмотрите на ответ Джорджа Баркера ниже.
splattne,
Поле со списком jQuery называется «автозаполнение». jqueryui.com/autocomplete/#combobox
Аарон

Ответы:

24

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

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

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

Elijah Manor
источник
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/

Lomaxx
источник
Мне нравится, что он превращает выделение в поле со списком.
beetstra
1
Изучив все предложения на странице, я остановился на этом. Быстро, просто, предоставляет только базовую функциональность, которую я хотел, и работал над существующим входом select
elwyn
Может также работать с JQuery UI Themeroller
codeulike
Этот был для меня бизнесом. Без проблем работает в IE7 и IE8, что было обязательным требованием. Поиск по инфиксу (в середине слова), полосы прокрутки для более длинных списков и удобная работа с другими компонентами.
Alastair
Это, безусловно, самый простой способ интеграции, если в вашем существующем коде используется старый раскрывающийся список HTML. Я использовал этот.
Макс
14

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

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


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

Еще один приятный плагин - Sexy Combo.

Пера
источник
3
Этот проект остановил активную разработку.
kajo
1
См.
Вилку
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

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

В него встроена система шаблонов, поэтому вы можете сделать результаты такими, как хотите. Работает во всех основных браузерах и принимает массивы и объекты 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 к пользовательскому значению.

Максим Саплин
источник
0

все, что вам нужно http://jquerycomboboxtmpl.codeplex.com/

раскрывающийся список шаблонов

руткит
источник
Пожалуйста, поясните хотя бы предлагаемое вами решение и почему оно соответствует критериям из вопроса.
мтср 04