Как сделать поиск в селекте
Привет!
помогите пожалуйста решить задачу, мне нужно сделать поиск в селекте вот пример кода <select name='sourcerate' style="font-size:11px;" onChange='Calc()'> <option selected="selected">Киев</option> <option>Москва</option> <option>Полтава</option> <option>Харьков</option> </select> задача в том что я могу просто в списке найти нужный мне город но мне нужно чтобы была возможность в поле select где выводит Киев я мог из клавиатуры вбить начальные буквы города и в списке сократилось количество городов а остались только искомые например я вбил с клавиатуры Пол и выводит только Полтава остальные 3 города не показывает. |
sergofedor06,
https://javascript.ru/forum/css-html...tml#post372707 |
<html> <head> <meta charset="utf-8"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.5.1/chosen.min.css"> </head> <body> <div style="width:520px;margin:0px auto;margin-top:30px;"> <select class="livesearch" style="width:400px;"> <option>Expert PHP</option> <option>Demo PHP</option> <option>PHP Tutorials</option> <option>PHP Framework</option> <option>PHP Libraries</option> <option>HTML</option> <option>CSS</option> <option>JS</option> <option>MySQL</option> </select> </div> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.5.1/chosen.jquery.min.js"></script> <script type="text/javascript"> $(".livesearch").chosen(); </script> </body> </html> |
Спасибо за примеры, второй вариант вроде лучше но плохо что использует стороннюю библиотеку
j0hnik подскажите пожалуйста как мне сменить в скрипте условие поиска, чтобы искало и в самом слове например если есть такой вариант <option>Libraries (php)</option> то по запросу php не ищет, а ищет только когда полное слово так (php) |
Цитата:
2 поля интут и селект как сделать чтобы визуально было как в примере j0hnik но при этом использовался чистый ява скрипт без библиотек |
Если честно не пользовался пока
https://harvesthq.github.io/chosen/ тут гляньте инфу о плагине. Без библиотек можно написать, но надо повозиться пару тройку часиков. |
|
Цитата:
$(".livesearch").chosen({search_contains : true}); |
да мне эта библиотека подходит, но есть конфликт скриптов
|
Цитата:
|
Часовой пояс GMT +3, время: 01:06. |