Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » Закладки » JavaScript:Расширенный и раскрывающийся комбобокс (combo box

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки

Открыть новую тему     Написать ответ в эту тему

Sindel



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору


Цитата:
Комбобоксами (combo box), называются гибриды списка c полем ввода: пользователь может выбрать существующий элемент, либо ввести свой.


Цитата:
Раскрывающиеся комбобоксы отсутствуют в интернете как класс.Поддержки их нет ни в браузерах, ни в HTML. Расширенные комбобоксы, их с трудом, но можно реализовать в интернете (через JavaScript).

 
Так как реализовать?
 
Определение и цитаты взяты из книги - www.uibook.ru




Добавил язык в название. — Svarga.

Всего записей: 559 | Зарегистр. 22-08-2002 | Отправлено: 00:12 23-07-2004 | Исправлено: Svarga, 13:32 24-07-2004
Sergeant

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
В голову приходит только один вариант: создать input типа text и ниже select с опциями. А яваскриптом отслеживать взаимные изменения. Если выбрана некая опция - вставлять ее значение в текстовое поле. И наоборот - следить за вводимым в текстовое поле значением. И если оно совпадает с неким из select, выбирать его.
 
Алгоритм такой, по-моему.

----------
Если вы спорите с идиотом,
Наверняка, он занимается тем же самым.

Всего записей: 1553 | Зарегистр. 06-08-2001 | Отправлено: 01:45 23-07-2004
andb

Junior Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Уже реализовано http://webfx.eae.net/dhtml/

Всего записей: 67 | Зарегистр. 10-01-2003 | Отправлено: 06:28 23-07-2004
Svarga

Moderator
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Sergeant
+ если раскрывающийся — поле text немного короче <select>'а и находится поверх него: чтобы стрелочка select'а для разворачивания списка была доступна всегда... При выборе значения в select'e (onChange) заменяем значение input type=text'а...
 
С расширенным проще: <input type=text>, а ниже <select> нужной высоты, при активации select'a — текстовое поле дизэйблим и переносим в него выбранное значение, при активации текстового поля дизэйблим select...
 
Добавлено
andb

Цитата:
Уже реализовано http://webfx.eae.net/dhtml/

http://webfx.eae.net/dhtml/combobox/combo_form_demo.html
в Опере работает, но коряво... можно, всё-таки попытаться через input type=text + select стандартные реализовать

----------
away.

Всего записей: 4161 | Зарегистр. 25-06-2002 | Отправлено: 06:32 23-07-2004
Svarga

Moderator
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Так... вот:
http://forall.ru-board.com/Svarga/javascript_combo-box.html
 
с раскрывающимся проблемы в ИЕ: что-то у меня не захотело текстовое поле в нём показываться поверх селекта (оно почему-то под ним по любому выводится )

----------
away.

Всего записей: 4161 | Зарегистр. 25-06-2002 | Отправлено: 13:14 24-07-2004
Svarga

Moderator
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Добавил туда же демонстрацию глюка ИЕ с z-index'ом (ничто не хочет располагаться поверх селекта в нём ):
http://forall.ru-board.com/Svarga/msie_select_gluck.html


----------
away.

Всего записей: 4161 | Зарегистр. 25-06-2002 | Отправлено: 21:18 24-07-2004 | Исправлено: Svarga, 21:19 24-07-2004
medreces

Newbie
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Это не глюк, это фича . Решение - там же...

Всего записей: 21 | Зарегистр. 18-12-2003 | Отправлено: 02:23 25-07-2004
Svarga

Moderator
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
medreces

Цитата:
Это не глюк, это фича . Решение - там же...

Такие глюки называются глюками, а не фичами
Не должны быть <select>'ы "оконнами" элементами... К тому же в ИЕ <select> с CSS почти не дружит...  
 
По твоей ссылке сие:

Цитата:
Вышележащий слой не накрывает <select>. Как это побороть?
 
<select> - это "оконный" элемент и имеет бесконечный z-index; накрыть его можно только другим оконным элементом.
Если речь идет о том, чтобы накрыть <select> "обычным" слоем (а не оконным элементом), то единственным решением такой проблемы будет прятать нижний слой с <select>-ом при его пересечении с верхним слоем.
Если слой должен накрывать <select> не полностью, решение задачи становится громоздким и неестественным, поэтому зачастую проще изменить структуру дизайна, чем добиваться решения данной проблемы любой ценой.

и почти там же:

Цитата:
Решения этой проблемы, увы, нет По-моему, уже несколько раз обсуждалось ...  
 
<select> - это "оконный" элемент и как таковой имеет бесконечный z-index. Единственное, чем его можно накрыть, так это другим оконным элементом.  
 
Посему на выбор (в порядке возрастания сложности):  
 
1. Поменять дизайн, чтобы выпадающее меню не накрывало <select>.  
2. Делать <select> невидимым, когда выпадает меню.  
3. Заключать меню в "оконный" контейнер, а именно iframe или popup-окно IE.  
 
Первое - настоящее "кросс-браузерное" решение. Второе - какое-то ублюдочное. Третье - только IE, да и то с IE 4 и 5.0 (iframe) прилично повозиться придется.  
 
Налево пойдешь ... направо пойдешь ... ну а если прямо пойдешь ... )

 
Собственно, ни одного решения — по сути: "убьём глюки браузера фантазией кодера" , как это обычно и случается при обнаружении глюков...
 
В моём случае прятать <select> нельзя, т. к. на нужна стрелочка, при нажатии на которую он будет разворачиваться (можно, конечно, сделать стрелку картинкой, но это не такой случай, чтоб элементы формы в картинках делать )...
 
в iframe заключать — извращение по определению — придётся организовывать передачу данных из того самого iframe'а, если же пользователь зайдёт с отключенными скриптами, то мы фактически потеряем один из элементов формы, что не есть хорошо ...
 
Popup-окно на странице поддерживается только MSIE 5.5+...
 
В общем, единственное, что в голову приходит не из области психопатологии — делаем проверку:
(document.all&&!window.opera)
если true, то специально для ИЕ выводим текстовое поле над меню, а не поверх него...
 
Примерно так: http://forall.ru-board.com/Svarga/ie_select_z-index_bug_solution.html

----------
away.

Всего записей: 4161 | Зарегистр. 25-06-2002 | Отправлено: 06:37 25-07-2004
andead



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
SearchField




Кавычек в URL не надо /Cheery/

Всего записей: 1821 | Зарегистр. 22-09-2005 | Отправлено: 18:57 17-01-2008 | Исправлено: Cheery, 03:24 18-01-2008
SkyRixx

Newbie
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
andead супер, спасибо
а кто нибудь знает как реализовать раскрывающийся комбобокс, также как при регистрации на сайте vkonakte.ru ...поиск идет как понял через аjax (интересно сам он писал или библиотеку стророннюю юзал? ) и по мере ответа появляется раскрывающийся комбобокс ....? оч понравилось
если мона то еще как там input текст переливается полосками при ожидании ответа кто нить знает?  
заранее пасиба

Всего записей: 6 | Зарегистр. 13-01-2008 | Отправлено: 19:50 19-01-2008 | Исправлено: SkyRixx, 19:53 19-01-2008
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
SkyRixx

Цитата:
понял через аjax (интересно сам он писал или библиотеку стророннюю юзал?  

а исходник посмотреть?  

Цитата:
если мона то еще как там input текст переливается полосками при ожидании ответа кто нить знает?  

опять же - смотрим в исходник.. или считаете, что для этого мы должны там регистрироваться?

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 22:55 19-01-2008
andead



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
если мона то еще как там input текст переливается полосками при ожидании ответа кто нить знает?  

поменять background на анимированную гифку =)
 
Добавлено:

Цитата:
а кто нибудь знает как реализовать раскрывающийся комбобокс

http://www.brandspankingnew.net/archive/2007/02/ajax_auto_suggest_v2.html

Всего записей: 1821 | Зарегистр. 22-09-2005 | Отправлено: 13:01 20-01-2008 | Исправлено: andead, 13:02 20-01-2008
SkyRixx

Newbie
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
andead
Cheery
Всем спасибо, разобрался уже сам

Всего записей: 6 | Зарегистр. 13-01-2008 | Отправлено: 22:21 03-02-2008
Открыть новую тему     Написать ответ в эту тему

Компьютерный форум Ru.Board » Интернет » Web-программирование » Закладки » JavaScript:Расширенный и раскрывающийся комбобокс (combo box


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2025

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru